From 021d23ab93e49434a212b6c45ff17b94933a2ffa Mon Sep 17 00:00:00 2001 From: Marc Mintel Date: Sat, 17 Jan 2026 02:57:53 +0100 Subject: [PATCH] wip --- app/[locale]/[slug]/page.tsx | 72 +++++++-- app/[locale]/blog/page.tsx | 203 ++++++++++++------------ app/[locale]/contact/page.tsx | 186 ++++++++++++++-------- app/[locale]/layout.tsx | 6 +- app/[locale]/products/page.tsx | 99 ++++++++---- app/[locale]/team/page.tsx | 212 ++++++++++++++++---------- components/Footer.tsx | 152 +++++++++--------- components/Header.tsx | 57 ++++--- components/home/CTA.tsx | 35 +++-- components/home/Experience.tsx | 41 +++-- components/home/GallerySection.tsx | 19 +-- components/home/Hero.tsx | 38 +++-- components/home/MeetTheTeam.tsx | 53 ++++--- components/home/ProductCategories.tsx | 29 ++-- components/home/RecentPosts.tsx | 78 ++++++---- components/home/VideoSection.tsx | 34 +++-- components/home/WhatWeDo.tsx | 34 +++-- components/home/WhyChooseUs.tsx | 46 ++++-- components/ui.tsx | 85 +++++++++-- styles/globals.css | 64 ++++++-- tsconfig.tsbuildinfo | 2 +- 21 files changed, 967 insertions(+), 578 deletions(-) diff --git a/app/[locale]/[slug]/page.tsx b/app/[locale]/[slug]/page.tsx index 4932c1ca..ba784eac 100644 --- a/app/[locale]/[slug]/page.tsx +++ b/app/[locale]/[slug]/page.tsx @@ -1,6 +1,6 @@ import { notFound } from 'next/navigation'; import { MDXRemote } from 'next-mdx-remote/rsc'; -import { getPostBySlug } from '@/lib/blog'; +import { Section, Container, Heading, Badge } from '@/components/ui'; interface PageProps { params: { @@ -10,14 +10,6 @@ interface PageProps { } export default async function StandardPage({ params: { locale, slug } }: PageProps) { - const page = await getPostBySlug(slug, locale); // Reusing blog logic for now as structure is same - - // If not found in blog, try pages directory (we need to implement getPageBySlug) - // Actually, let's implement getPageBySlug in lib/mdx.ts or similar - - // For now, let's assume we use a unified loader or separate. - // Let's use a separate loader for pages. - const { getPageBySlug } = await import('@/lib/pages'); const pageData = await getPageBySlug(slug, locale); @@ -26,11 +18,63 @@ export default async function StandardPage({ params: { locale, slug } }: PagePro } return ( -
-

{pageData.frontmatter.title}

-
- -
+
+ {/* Hero Section */} +
+
+
+
+ +
+ Information + + {pageData.frontmatter.title} + +
+ +
+ +
+ +
+ {/* Sticky Narrative Sidebar */} +
+
+
+

Quick Navigation

+ +
+ +
+

Need Help?

+

Our support team is available for any questions regarding this topic.

+ Contact Us → +
+
+
+ + {/* Main Content */} +
+
+ +
+
+
+ +
); } diff --git a/app/[locale]/blog/page.tsx b/app/[locale]/blog/page.tsx index a386c31a..a54975a8 100644 --- a/app/[locale]/blog/page.tsx +++ b/app/[locale]/blog/page.tsx @@ -1,6 +1,6 @@ import Link from 'next/link'; import { getAllPosts } from '@/lib/blog'; -import { getTranslations } from 'next-intl/server'; +import { Section, Container, Heading, Card, Badge, Button } from '@/components/ui'; interface BlogIndexProps { params: { @@ -29,117 +29,116 @@ export default async function BlogIndex({ params: { locale } }: BlogIndexProps) const remainingPosts = sortedPosts.slice(1); return ( -
- {/* Hero Section */} -
-
-
-

- {locale === 'de' ? 'KLZ Blog' : 'KLZ Blog'} -

-

- {locale === 'de' - ? 'Insights, News und technisches Know-how aus der Welt der Kabelinfrastruktur und erneuerbaren Energien.' - : 'Insights, news and technical know-how from the world of cable infrastructure and renewable energies.'} -

-
-
-
- -
- {/* Featured Post */} - {featuredPost && ( - -
- {featuredPost.frontmatter.featuredImage && ( -
- {featuredPost.frontmatter.title} -
-
- )} -
- {featuredPost.frontmatter.category && ( - - {featuredPost.frontmatter.category} - - )} -

+
+ {/* Hero Section - Immersive Magazine Feel */} +
+ {featuredPost && featuredPost.frontmatter.featuredImage && ( + <> + {featuredPost.frontmatter.title} +
+ + )} + + +
+ Featured Post + {featuredPost && ( + <> +

{featuredPost.frontmatter.title} -

-

+

+

{featuredPost.frontmatter.excerpt}

-
-
- KLZ -
-
-
KLZ Cables
-
- {new Date(featuredPost.frontmatter.date).toLocaleDateString(locale, { + + + )} +
+ + + +
+ +
+ + {locale === 'de' ? 'Alle Beiträge' : 'All Articles'} + +
+ {/* Category filters could go here */} + All + Industry + Technical + Sustainability +
+
+ + {/* Grid for remaining posts */} +
+ {remainingPosts.map((post) => ( + + + {post.frontmatter.featuredImage && ( +
+ {post.frontmatter.title} +
+ {post.frontmatter.category && ( + + {post.frontmatter.category} + + )} +
+ )} +
+
+ {new Date(post.frontmatter.date).toLocaleDateString(locale, { year: 'numeric', month: 'long', day: 'numeric' })}
-
-
-
-
- - )} - - {/* Grid for remaining posts */} -
- {remainingPosts.map((post) => ( - -
- {post.frontmatter.featuredImage && ( -
- {post.frontmatter.title} - {post.frontmatter.category && ( - - {post.frontmatter.category} +

+ {post.frontmatter.title} +

+

+ {post.frontmatter.excerpt} +

+
+ + {locale === 'de' ? 'Weiterlesen' : 'Read more'} - )} +
+ + + +
+
- )} -
-
- {new Date(post.frontmatter.date).toLocaleDateString(locale, { - year: 'numeric', - month: 'long', - day: 'numeric' - })} -
-

- {post.frontmatter.title} -

-

- {post.frontmatter.excerpt} -

-
- - {locale === 'de' ? 'Weiterlesen' : 'Read more'} - - - - -
-
-
- - ))} -
-
+ + + ))} +
+ + {/* Pagination Placeholder */} +
+ + + + + +
+ +
); } diff --git a/app/[locale]/contact/page.tsx b/app/[locale]/contact/page.tsx index d83f6462..5edc0097 100644 --- a/app/[locale]/contact/page.tsx +++ b/app/[locale]/contact/page.tsx @@ -1,87 +1,153 @@ import { useTranslations } from 'next-intl'; -import { Section, Container, Button } from '@/components/ui'; +import { Section, Container, Button, Heading, Card } from '@/components/ui'; export default function ContactPage() { const t = useTranslations('Contact'); return ( -
-
- -
-

{t('title')}

-

+

+ {/* Hero Section */} +
+
+
+
+ +
+ + {t('title')} + +

{t('subtitle')}

+ +
-
+
+ +
{/* Contact Info */} -
-
-

{t('info.title')}

-
-

- - - - - - {t('info.address')} - -

-

- - - - +49 881 92537298 -

-

- - - - info@klz-vertriebs-gmbh.com -

+
+
+ + How to Reach Us + +
+
+
+ + + + +
+
+

Our Office

+

+ {t('info.address')} +

+
+
+ +
+
+ + + +
+
+

Phone

+ +49 881 92537298 +
+
+ +
+
+ + + +
+ +
-
-

{t('hours.title')}

-
    -
  • - {t('hours.weekdays')} - {t('hours.weekdaysTime')} +
    + {t('hours.title')} +
      +
    • + {t('hours.weekdays')} + {t('hours.weekdaysTime')}
      • -
    • - {t('hours.weekend')} - {t('hours.closed')} +
    • + {t('hours.weekend')} + {t('hours.closed')}
- {/* Contact Form Placeholder */} -
-

{t('form.title')}

-
-
- - -
-
- - -
-
- - -
- -
+ {/* Contact Form */} +
+ + + {t('form.title')} + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+
+ + {/* Map Placeholder */} +
+
+
+
+ + + +
+

Interactive Map Coming Soon

+
+
+
); } diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx index 2d178bce..61c0c59d 100644 --- a/app/[locale]/layout.tsx +++ b/app/[locale]/layout.tsx @@ -16,11 +16,11 @@ export default async function LocaleLayout({ const messages = await getMessages(); return ( - - + +
-
+
{children}