diff --git a/app/layout.tsx b/app/layout.tsx index d864815..fe7e4a2 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,16 +1,18 @@ "use client"; -import React, { useEffect, useState } from "react"; +import React, { useEffect, useState, useRef } from "react"; import Footer from "./components/Footer"; import "./assets/main.css"; import NavLink from "./components/NavLink"; export default function RootLayout({ children }) { const [visitCount, setVisitCount] = useState(0); + const [isMenuOpen, setIsMenuOpen] = useState(false); + const menuRef = useRef(null); // Référence pour le menu burger -const [isMenuOpen, setIsMenuOpen] = useState(false); -const toggleMenu = () => setIsMenuOpen(!isMenuOpen); - + const toggleMenu = () => { + setIsMenuOpen(!isMenuOpen); + }; useEffect(() => { // Récupère le compteur de visites depuis localStorage @@ -23,57 +25,60 @@ const toggleMenu = () => setIsMenuOpen(!isMenuOpen); return ( -
- {/* Conserve le fond en plein écran */} -
+
+ {/* Conserve le fond en plein écran */} +
- {/* Contenu centré avec largeur contrôlée */} -
- -
+ {/* Contenu centré avec largeur contrôlée */} +
{/* Cercles animés */}
-
-
+
+
-
-
-

Portfolio Gras-Calvet Fernand

- {/* Bouton menu burger */} - - {/* Menu desktop */} - -
-
+ {/* Header */} +
+
+

+ Portfolio Gras-Calvet Fernand +

- {isMenuOpen && ( -
-
+
- {/* Liens du menu */} - - - - - -
-)} + {/* Menu mobile */} + {isMenuOpen && ( +
+ +
+ )}
{children} @@ -88,4 +93,4 @@ const toggleMenu = () => setIsMenuOpen(!isMenuOpen); ); -} \ No newline at end of file +}