puzzle-trainer/layout.tsx
2026-05-23 01:05:21 +00:00

86 lines
3.2 KiB
TypeScript

import type { Metadata } from "next";
import "./globals.css";
import Link from "next/link";
import { NavLink } from "@/components/NavLink";
export const metadata: Metadata = {
title: { default: "Puzzle Trainer", template: "%s — Puzzle Trainer" },
description: "Entraîne-toi aux puzzles logiques chaque jour.",
openGraph: {
title: "Puzzle Trainer",
description: "Entraîne-toi aux puzzles logiques chaque jour.",
url: "https://puzzles.reverdin.eu",
siteName: "Puzzle Trainer",
locale: "fr_FR",
type: "website",
images: [{ url: "https://puzzles.reverdin.eu/opengraph-image", width: 1200, height: 630 }],
},
twitter: {
card: "summary_large_image",
title: "Puzzle Trainer",
description: "Entraîne-toi aux puzzles logiques chaque jour.",
images: ["https://puzzles.reverdin.eu/opengraph-image"],
},
metadataBase: new URL("https://puzzles.reverdin.eu"),
manifest: "/manifest.json",
themeColor: "#111827",
appleWebApp: { capable: true, statusBarStyle: "default", title: "Puzzles" },
};
const GAMES = [
{ href: "/queens", label: "Queens", symbol: "♛" },
{ href: "/tango", label: "Tango", symbol: "☀" },
{ href: "/zip", label: "Zip", symbol: "∞" },
{ href: "/sudoku", label: "Sudoku", symbol: "#" },
{ href: "/patches", label: "Patches", symbol: "▦" },
];
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="fr" className="h-full">
<head>
<link rel="apple-touch-icon" sizes="180x180" href="/favicon.ico" />
</head>
<body className="min-h-full flex flex-col bg-[#f8fafc]">
<header className="border-b border-gray-100 bg-white/90 backdrop-blur-sm sticky top-0 z-50 shadow-[0_1px_0_0_#f1f5f9]">
<div className="max-w-4xl mx-auto px-4 h-14 flex items-center gap-4">
<Link
href="/"
className="text-base font-bold text-gray-900 tracking-tight shrink-0 hover:text-gray-700 transition-colors"
>
Puzzle Trainer
</Link>
{/* Nav games */}
<nav className="flex items-center gap-0.5 overflow-x-auto scrollbar-none flex-1 min-w-0">
{GAMES.map(g => (
<NavLink key={g.href} href={g.href} label={g.label} symbol={g.symbol} />
))}
</nav>
<Link
href="/archive"
className="ml-auto text-sm text-gray-400 hover:text-gray-700 shrink-0 transition-colors"
title="Archives des puzzles"
>
Archives
</Link>
</div>
</header>
<main className="flex-1 py-8 px-4">
<div className="max-w-4xl mx-auto">{children}</div>
</main>
<footer className="border-t border-gray-100 bg-white py-5 text-center text-xs text-gray-400 space-y-1">
<div>
Puzzle Trainer · Puzzles générés quotidiennement ·{" "}
<Link href="/mentions-legales" className="hover:text-gray-600 transition-colors underline-offset-2 hover:underline">
Mentions légales
</Link>
</div>
</footer>
</body>
</html>
);
}