soufiane
ac8d27ae05
- Replace <img> with Next.js <Image> in not-found.tsx - Add console mock in jest.setup.js to silence logs during tests 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
64 lines
2.6 KiB
TypeScript
64 lines
2.6 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import Image from "next/image";
|
|
import { useRouter } from "next/navigation";
|
|
|
|
export default function NotFound() {
|
|
const router = useRouter();
|
|
|
|
return (
|
|
<div className="min-h-screen bg-gradient-to-br from-[#f5f5f0] via-[#faf9f5] to-[#f5f5f0] flex items-center justify-center px-4">
|
|
<div className="text-center max-w-2xl mx-auto">
|
|
{/* Logo and 404 */}
|
|
<div className="mb-8">
|
|
<div className="flex justify-center mb-8">
|
|
<Image
|
|
src="/logos/logo.svg"
|
|
alt="Thé Tip Top Logo"
|
|
width={320}
|
|
height={100}
|
|
className="w-64 h-auto md:w-80"
|
|
priority
|
|
/>
|
|
</div>
|
|
<div className="text-[120px] md:text-[150px] leading-none font-bold text-[#d4a574] opacity-30 select-none">
|
|
404
|
|
</div>
|
|
</div>
|
|
|
|
{/* Text content */}
|
|
<h1 className="text-4xl md:text-5xl font-bold text-[#5a5a4e] mb-4">
|
|
Oups ! Page introuvable
|
|
</h1>
|
|
<p className="text-lg text-[#8a8a7a] mb-8 max-w-md mx-auto">
|
|
Il semble que cette page se soit évaporée comme la vapeur d'une bonne tasse de thé...
|
|
</p>
|
|
|
|
{/* Action buttons */}
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<button
|
|
onClick={() => router.back()}
|
|
className="inline-flex items-center justify-center gap-2 border-2 border-[#d4a574] text-[#d4a574] hover:bg-[#d4a574] hover:text-white font-bold px-8 py-3 rounded-lg transition-all duration-300"
|
|
>
|
|
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
|
|
</svg>
|
|
Retour
|
|
</button>
|
|
<Link
|
|
href="/"
|
|
className="inline-flex items-center justify-center gap-2 bg-gradient-to-r from-[#d4a574] to-[#c4956a] hover:from-[#e5b685] hover:to-[#d4a574] text-white font-bold px-8 py-3 rounded-lg transition-all shadow-lg hover:scale-105 duration-300"
|
|
>
|
|
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
|
|
</svg>
|
|
Accueil
|
|
</Link>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|