71 lines
3.7 KiB
TypeScript
71 lines
3.7 KiB
TypeScript
import { getTranslations } from 'next-intl/server';
|
|
import { Container, Button, Heading } from '@/components/ui';
|
|
import Scribble from '@/components/Scribble';
|
|
import ClientNotFoundTracker from '@/components/analytics/ClientNotFoundTracker';
|
|
|
|
export default async function NotFound() {
|
|
console.log('--- NOT FOUND RENDERED ---');
|
|
const t = await getTranslations('Error.notFound');
|
|
|
|
// Suggested URL logic removed along with Payload CMS
|
|
let suggestedUrl = null;
|
|
let suggestedLang = null;
|
|
|
|
return (
|
|
<>
|
|
<script dangerouslySetInnerHTML={{ __html: `document.body.setAttribute('data-force-solid-header', 'true');` }} />
|
|
<ClientNotFoundTracker path="" />
|
|
|
|
<div className="relative min-h-[80vh] flex flex-col items-center justify-center overflow-hidden bg-[#050B14] py-24 px-4 mt-16">
|
|
{/* Deep Tech Grid Background */}
|
|
<div className="absolute inset-0 bg-[linear-gradient(to_right,#8080800a_1px,transparent_1px),linear-gradient(to_bottom,#8080800a_1px,transparent_1px)] bg-[size:40px_40px] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_50%,#000_70%,transparent_100%)] pointer-events-none" />
|
|
|
|
{/* Glowing Orb */}
|
|
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-96 h-96 bg-primary/20 blur-[120px] rounded-full pointer-events-none" />
|
|
|
|
<div className="relative z-10 w-full max-w-2xl mx-auto">
|
|
<div className="group relative bg-[#050B14]/80 backdrop-blur-xl rounded-[2.5rem] p-12 md:p-16 border border-white/10 shadow-2xl overflow-hidden text-center">
|
|
{/* Inner Shimmer */}
|
|
<div className="absolute inset-0 bg-gradient-to-br from-white/[0.05] to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-700 pointer-events-none" />
|
|
|
|
<div className="relative mb-8">
|
|
<h1 className="text-8xl md:text-9xl font-heading font-black text-transparent bg-clip-text bg-gradient-to-b from-white to-white/20 drop-shadow-[0_0_30px_rgba(255,255,255,0.1)]">
|
|
404
|
|
</h1>
|
|
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-full h-1 bg-primary/40 blur-md skew-y-[-10deg]" />
|
|
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-full h-px bg-primary skew-y-[-10deg] shadow-[0_0_15px_rgba(var(--color-primary),1)]" />
|
|
</div>
|
|
|
|
<div className="inline-flex items-center gap-3 px-4 py-1.5 mb-6 rounded-full bg-red-500/10 border border-red-500/20 text-xs font-bold uppercase tracking-wider text-red-400">
|
|
<span className="w-2 h-2 rounded-full bg-red-500 animate-pulse shadow-[0_0_10px_rgba(239,68,68,0.8)]" />
|
|
SYSTEM PROTOCOL: NOT FOUND
|
|
</div>
|
|
|
|
<Heading level={2} className="text-2xl md:text-3xl font-bold mb-4 text-white">
|
|
{t('title')}
|
|
</Heading>
|
|
|
|
<p className="text-white/60 mb-10 max-w-md text-lg mx-auto leading-relaxed">
|
|
{t('description')}
|
|
</p>
|
|
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<Button href="/" variant="primary" className="shadow-[0_0_20px_rgba(var(--color-primary),0.3)]">
|
|
{t('cta')}
|
|
</Button>
|
|
<Button href="/kontakt" variant="outline" className="border-white/20 text-white hover:bg-white/5">
|
|
Support kontaktieren
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Decorative Base Line */}
|
|
<div className="w-full flex justify-center mt-12 opacity-50">
|
|
<div className="w-px h-24 bg-gradient-to-t from-primary to-transparent" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|