mmintel/klz-cables.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

wip
Some checks failed
Build & Deploy / deploy (push) Failing after 17s
Details

Browse Source
This commit is contained in:
Marc Mintel
2026-01-17 16:06:16 +01:00
parent f64cb71170
commit e6651761f3
20 changed files with 453 additions and 350 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
app/[locale]/[slug]/page.tsx
View File

@@ -20,53 +20,53 @@ export default async function StandardPage({ params: { locale, slug } }: PagePro
return (
<div className="flex flex-col min-h-screen bg-neutral-light">
{/* Hero Section */}
<section className="bg-primary-dark text-white py-32 relative overflow-hidden">
<section className="bg-primary-dark text-white py-20 md:py-32 relative overflow-hidden">
<div className="absolute inset-0 opacity-20">
<div className="absolute top-0 left-0 w-full h-full bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-accent via-transparent to-transparent" />
</div>
<Container className="relative z-10">
<div className="max-w-4xl animate-slide-up">
<Badge variant="accent" className="mb-6">Information</Badge>
<Heading level={1} className="text-white mb-0">
<Badge variant="accent" className="mb-4 md:mb-6">Information</Badge>
<Heading level={1} className="text-3xl md:text-6xl lg:text-7xl xl:text-8xl text-white mb-0">
<span className="text-white">{pageData.frontmatter.title}</span>
</Heading>
</div>
</Container>
</section>
<Section className="bg-white -mt-12 relative z-20 rounded-t-[60px] shadow-2xl">
<Section className="bg-white -mt-8 md:-mt-12 relative z-20 rounded-t-[32px] md:rounded-t-[60px] shadow-2xl py-12 md:py-28">
<Container>
<div className="grid grid-cols-1 lg:grid-cols-12 gap-16">
<div className="sticky-narrative-container">
{/* Sticky Narrative Sidebar */}
<div className="lg:col-span-4">
<div className="sticky top-32 space-y-8">
<div className="p-8 bg-neutral-light rounded-3xl border border-neutral-medium">
<h3 className="text-xl font-bold text-primary mb-4">Quick Navigation</h3>
<nav className="space-y-4">
<div className="h-1 w-12 bg-accent rounded-full" />
<p className="text-text-secondary leading-relaxed">
<div className="sticky-narrative-sidebar mb-8 lg:mb-0">
<div className="lg:sticky lg:top-32 space-y-4 md:space-y-8">
<div className="p-6 md:p-8 bg-neutral-light rounded-2xl md:rounded-3xl border border-neutral-medium">
<h3 className="text-lg md:text-xl font-bold text-primary mb-3 md:mb-4">Quick Navigation</h3>
<nav className="space-y-3 md:space-y-4">
<div className="h-1 w-10 md:w-12 bg-accent rounded-full" />
<p className="text-sm md:text-base text-text-secondary leading-relaxed">
Explore the details of {pageData.frontmatter.title}. KLZ provides comprehensive information on all our services and corporate policies.
</p>
</nav>
</div>
<div className="p-8 bg-primary-dark rounded-3xl text-white">
<h3 className="text-xl font-bold mb-4">Need Help?</h3>
<p className="text-white/70 mb-6">Our support team is available for any questions regarding this topic.</p>
<a href={`/${locale}/contact`} className="text-accent font-bold hover:underline">Contact Us &rarr;</a>
<div className="p-6 md:p-8 bg-primary-dark rounded-2xl md:rounded-3xl text-white">
<h3 className="text-lg md:text-xl font-bold mb-3 md:mb-4">Need Help?</h3>
<p className="text-sm md:text-base text-white/70 mb-4 md:mb-6">Our support team is available for any questions regarding this topic.</p>
<a href={`/${locale}/contact`} className="text-accent font-bold hover:underline touch-target">Contact Us &rarr;</a>
</div>
</div>
</div>
{/* Main Content */}
<div className="lg:col-span-8">
<article className="prose prose-xl prose-primary max-w-none
<div className="sticky-narrative-content">
<article className="prose prose-sm md:prose-lg lg:prose-xl prose-primary max-w-none
prose-headings:text-primary prose-headings:font-bold prose-headings:tracking-tight
prose-p:text-text-secondary prose-p:leading-relaxed
prose-strong:text-primary prose-strong:font-extrabold
prose-a:text-primary prose-a:font-bold prose-a:no-underline hover:prose-a:underline
prose-img:rounded-3xl prose-img:shadow-2xl
prose-ul:list-disc prose-ul:pl-6
prose-img:rounded-2xl md:prose-img:rounded-3xl prose-img:shadow-2xl
prose-ul:list-disc prose-ul:pl-5 md:prose-ul:pl-6
prose-li:text-text-secondary
">
<MDXRemote source={pageData.content} />