Mathew
9b6638eb00
Deploy / deploy (push) Successful in 1m13s
Deux courbes partagées dans lib/motion.ts, pour que le CSS et Framer aient le même feeling, et quatre primitives que Tailwind ne sait pas exprimer : reflet de bouton, halo qui suit le curseur, soulignement qui se dessine, secousse d'erreur. Nouveaux composants : Stagger (les collections se distribuent une par une), Spotlight (trouve son parent tout seul, donc les cartes restent des composants serveur), ScrollProgress, BackToTop, Parallax, Spinner, CheckMark. Reveal accepte maintenant une direction. Côté rendu : le trait de nav glisse d'un onglet à l'autre, les cartes se soulèvent, le hero réagit au scroll, les piliers entrent en zig-zag, la lightbox glisse dans le sens demandé et les formulaires répondent. prefers-reduced-motion est respecté partout : Framer coupe via useReducedMotion, le CSS via la media query déjà en place. Le commit embarque aussi la réorganisation des composants par domaine qui était en cours dans l'arbre de travail — les deux étaient trop imbriquées pour être séparées proprement. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
61 lines
2.0 KiB
TypeScript
61 lines
2.0 KiB
TypeScript
import type { Metadata } from "next";
|
|
import { Logo } from "./components/ui/Logo";
|
|
import { ButtonLink } from "./components/ui/ButtonLink";
|
|
|
|
export const metadata: Metadata = {
|
|
title: "Lost on the climb",
|
|
description: "This summit doesn't exist yet.",
|
|
};
|
|
|
|
export default function NotFound() {
|
|
return (
|
|
<div className="relative min-h-screen flex items-center justify-center px-6 lg:px-10 overflow-hidden isolate">
|
|
<div
|
|
aria-hidden
|
|
className="absolute inset-0 z-0"
|
|
style={{
|
|
background:
|
|
"radial-gradient(ellipse at 50% 60%, rgba(196,184,150,0.08) 0%, rgba(10,10,10,0) 60%)",
|
|
}}
|
|
/>
|
|
|
|
{/* Glowing orb */}
|
|
<div
|
|
aria-hidden
|
|
className="animate-orb-pulse absolute left-1/2 top-1/2 z-0 w-[500px] h-[500px] sm:w-[700px] sm:h-[700px] rounded-full pointer-events-none"
|
|
style={{
|
|
background:
|
|
"radial-gradient(circle, rgba(196,184,150,0.35) 0%, rgba(196,184,150,0.15) 30%, rgba(196,184,150,0) 70%)",
|
|
filter: "blur(80px)",
|
|
}}
|
|
/>
|
|
|
|
<div className="relative z-10 max-w-2xl w-full text-center pt-24 pb-12">
|
|
<Logo width={120} className="mx-auto mb-10 opacity-40" />
|
|
|
|
<p className="font-display text-sm tracking-[0.3em] text-accent mb-4">
|
|
404
|
|
</p>
|
|
<h1 className="font-display text-4xl sm:text-6xl lg:text-7xl tracking-wider leading-[0.95] mb-8">
|
|
LOST ON
|
|
<br />
|
|
THE CLIMB.
|
|
</h1>
|
|
<p className="text-lg text-foreground-muted leading-relaxed max-w-xl mx-auto mb-12">
|
|
This summit doesn't exist yet. The page you're looking for
|
|
may have drifted off the map.
|
|
</p>
|
|
|
|
<div className="flex flex-col items-center gap-4 sm:flex-row sm:justify-center">
|
|
<ButtonLink href="/" block>
|
|
BACK TO BASE CAMP
|
|
</ButtonLink>
|
|
<ButtonLink href="/games" variant="outline" block>
|
|
EXPLORE OUR GAMES
|
|
</ButtonLink>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|