// Nav + Footer + mobile drawer + sticky phone — La Coutume, Toucy const Nav = ({ route, setRoute }) => { const [scrolled, setScrolled] = React.useState(false); const [open, setOpen] = React.useState(false); React.useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 20); onScroll(); window.addEventListener("scroll", onScroll, { passive: true }); return () => window.removeEventListener("scroll", onScroll); }, []); React.useEffect(() => { setOpen(false); }, [route]); // Menu ouvert : on bloque le défilement de la page derrière, on ferme sur // Échap, et on rouvre le défilement si le composant disparaît. // (On agit sur : est réécrit par App pour l'accent/les animations.) React.useEffect(() => { document.documentElement.classList.toggle("drawer-open", open); if (!open) return; const onKey = (e) => { if (e.key === "Escape") setOpen(false); }; window.addEventListener("keydown", onKey); return () => window.removeEventListener("keydown", onKey); }, [open]); React.useEffect(() => () => document.documentElement.classList.remove("drawer-open"), []); const links = [ { id: "home", label: "Accueil" }, { id: "menu", label: "La carte" }, { id: "apropos", label: "À propos" }, { id: "contact", label: "Contact" }, ]; const go = (id) => (e) => { e.preventDefault(); setRoute(id); window.scrollTo({ top: 0, behavior: "smooth" }); }; return ( <> ); }; const Footer = ({ setRoute }) => { const go = (id) => (e) => { e.preventDefault(); setRoute(id); window.scrollTo({ top: 0, behavior: "smooth" }); }; return ( ); }; Object.assign(window, { Nav, Footer });