Merge version_1 into main

Merge version_1 into main

src/app/layout.tsx

@@ -11,8 +11,8 @@ import { Playfair_Display, Inter } from "next/font/google";
 
 
 export const metadata: Metadata = {
-  title: 'Welcome',
-  description: 'Our official website.',
+  title: 'L\'Elegante | Authentic Italian Fine Dining in Florence',
+  description: 'Indulge in an authentic Italian dining experience at L\'Elegante. Featuring regional traditions, fine wines, and an sophisticated, intimate atmosphere.',
   openGraph: {
     "title": "L'Elegante | Authentic Italian Fine Dining",
     "description": "Join us for an unforgettable evening of culinary tradition.",

src/app/page.tsx

@@ -1,6 +1,5 @@
-"use client";
-
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+'use client';
+import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import TextAbout from '@/components/sections/about/TextAbout';
@@ -9,74 +8,87 @@ import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
 
-const navItems = [
-  { name: "Home", id: "/" },
-];
-
 export default function Page() {
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "About", id: "/about" },
+    { name: "Menu", id: "/menu" },
+    { name: "Gallery", id: "/gallery" },
+    { name: "Contact", id: "/contact" }
+  ];
+
   return (
-    <ThemeProvider
-      defaultButtonVariant="text-stagger"
-      defaultTextAnimation="entrance-slide"
-      borderRadius="rounded"
-      contentWidth="medium"
-      sizing="medium"
-      background="circleGradient"
-      cardStyle="glass-elevated"
-      primaryButtonStyle="gradient"
-      secondaryButtonStyle="glass"
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
       headingFontWeight="normal"
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen navItems={navItems} />
       </div>
       <div id="hero" data-section="hero">
-        <HeroBillboardScroll
-          title="Welcome to our site"
-          description="Experience the best services tailored for you."
-          background={{ variant: "animated-grid" }}
+        <HeroBillboardScroll 
+          title="The Best Culinary Experience"
+          description="Indulge in a curated selection of fine dining experiences designed for every palate."
+          background={{ variant: "gradient-bars" }}
         />
       </div>
       <div id="about" data-section="about">
-        <TextAbout
-          title="About Us"
+        <TextAbout 
+          title="Our Philosophy"
+          tag="Authentic Taste"
           useInvertedBackground={false}
         />
       </div>
       <div id="menu" data-section="menu">
-        <ProductCardOne
+        <ProductCardOne 
           title="Our Menu"
-          description="Delicious offerings for everyone."
-          gridVariant="uniform-all-items-equal"
+          description="Discover our signature dishes."
+          gridVariant="bento-grid"
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
+          products={[
+            { id: "1", name: "Signature Dish", price: "$25", imageSrc: "https://images.unsplash.com/photo-1546069901-ba9599a7e63c" },
+            { id: "2", name: "Fresh Salad", price: "$15", imageSrc: "https://images.unsplash.com/photo-1512621776951-a57141f2eefd" },
+            { id: "3", name: "Gourmet Burger", price: "$18", imageSrc: "https://images.unsplash.com/photo-1568901346375-23c9450c58cd" }
+          ]}
         />
       </div>
       <div id="gallery" data-section="gallery">
-        <FeatureCardSeven
+        <FeatureCardSeven 
           title="Gallery"
-          description="Check out our latest work."
+          description="A glimpse into our kitchen and dining space."
           animationType="slide-up"
           textboxLayout="default"
-          features={[]}
           useInvertedBackground={false}
+          features={[
+            { id: 1, title: "Fresh Ingredients", description: "Sourced locally daily.", imageSrc: "https://images.unsplash.com/photo-1542838132-92c53300491e" },
+            { id: 2, title: "Cozy Atmosphere", description: "Perfect for any occasion.", imageSrc: "https://images.unsplash.com/photo-1517248135467-4c7edcad34c4" }
+          ]}
         />
       </div>
       <div id="reservation" data-section="reservation">
-        <ContactSplitForm
-          title="Make a Reservation"
-          description="Contact us for bookings."
-          inputs={[{ name: "name", type: "text", placeholder: "Your Name" }, { name: "email", type: "email", placeholder: "Your Email" }]}
+        <ContactSplitForm 
+          title="Book a Table"
+          description="We look forward to hosting you."
+          inputs={[{ name: "name", type: "text", placeholder: "Your Name", required: true }, { name: "email", type: "email", placeholder: "Email Address", required: true }]}
           mediaAnimation="slide-up"
           useInvertedBackground={false}
         />
       </div>
       <div id="contact" data-section="contact">
-        <FooterSimple
-          columns={[]}
-          bottomLeftText="© 2024"
-          bottomRightText="All rights reserved."
+        <FooterSimple 
+          columns={[{ title: "Company", items: [{ label: "About" }, { label: "Contact" }] }]}
+          bottomLeftText="© 2024 Culinary Co."
+          bottomRightText="All Rights Reserved."
         />
       </div>
     </ThemeProvider>