Switch to version 3: modified src/app/page.tsx

src/app/page.tsx

@@ -2,18 +2,25 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
+import { useState } from "react";
 import ContactText from '@/components/sections/contact/ContactText';
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
 import MediaAbout from '@/components/sections/about/MediaAbout';
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
 
 export default function LandingPage() {
+  const [lang, setLang] = useState("EN");
+
+  const toggleLang = () => {
+    setLang((prev) => (prev === "EN" ? "AL" : prev === "AL" ? "IT" : "EN"));
+  };
+
   return (
     <ThemeProvider
         defaultButtonVariant="text-shift"
@@ -29,16 +36,17 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingInline
+      <NavbarLayoutFloatingOverlay
       navItems={[
         { name: "Home", id: "hero" },
         { name: "About", id: "about" },
         { name: "Menu", id: "menu" },
         { name: "Reviews", id: "testimonials" },
         { name: "Contact", id: "contact" },
+        { name: lang, id: "#" }
       ]}
       brandName="La Fortezza"
-      button={{ text: "Reserve Table", href: "#contact" }}
+      button={{ text: "Reserve Table", onClick: toggleLang }}
     />
   </div>