Update src/app/reservations/page.tsx

Merge version_1 into main

src/app/contact/page.tsx

@@ -2,12 +2,12 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
-import SplitAbout from '@/components/sections/about/SplitAbout';
+import ContactForm from '@/components/form/ContactForm';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 
-export default function LandingPage() {
+export default function ContactPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="elastic-effect"
@@ -22,93 +22,37 @@ export default function LandingPage() {
         headingFontWeight="medium"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
+        <NavbarStyleCentered
-      <NavbarStyleCentered
+          navItems={[
-      navItems={[
+            { name: "Home", id: "/" },
-        {
+            { name: "Reservations", id: "/reservations" },
-          name: "Home",
+            { name: "Contact", id: "/contact" },
-          id: "/",
+          ]}
-        },
+          button={{ text: "Book Now", href: "/reservations" }}
-        {
+          brandName="Lumière Dining"
-          name: "Menu",
+        />
-          id: "/menu",
+        <ContactCTA 
-        },
+            tag="Contact"
-        {
+            title="Get in Touch"
-          name: "Gallery",
+            description="We are here to assist with any inquiries you might have."
-          id: "/gallery",
+            buttons={[{ text: "Call Us", href: "tel:+1234567890" }]}
-        },
+            background={{ variant: "plain" }}
-        {
+            useInvertedBackground={false}
-          name: "Reservations",
+        />
-          id: "/reservations",
+        <div className="py-20">
-        },
+            <ContactForm 
-        {
+                title="Send Message"
-          name: "Contact",
+                description="Fill out the form below and we will get back to you shortly."
-          id: "/contact",
+                tag="Support"
-        },
+                buttonText="Send"
-      ]}
+                useInvertedBackground={false}
-      button={{
+            />
-        text: "Book Now",
+        </div>
-        href: "/reservations",
+        <FooterLogoReveal
-      }}
+          logoText="Lumière Dining"
-      brandName="Lumière Dining"
+          leftLink={{ text: "Privacy Policy", href: "#" }}
-    />
+          rightLink={{ text: "Terms of Use", href: "#" }}
-  </div>
+        />
-
-  <div id="contact-info" data-section="contact-info">
-      <SplitAbout
-      textboxLayout="default"
-      useInvertedBackground={false}
-      title="Visit Us"
-      description="Find us in the heart of the district, open Tuesday through Sunday."
-      bulletPoints={[
-        {
-          title: "Location",
-          description: "123 Culinary Avenue, Foodie District, City Center",
-        },
-        {
-          title: "Hours",
-          description: "Tue-Sun: 5:00 PM - 11:00 PM",
-        },
-        {
-          title: "Contact",
-          description: "+1 (555) 123-4567",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/restaurant-dinner-table-with-plates-cutlery-yellow-blue-glasses_140725-8444.jpg?_wi=2"
-      imageAlt="Restaurant ambiance"
-      mediaAnimation="slide-up"
-    />
-  </div>
-
-  <div id="socialProof" data-section="socialProof">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      names={[
-        "Facebook",
-        "Instagram",
-        "TripAdvisor",
-        "Google Reviews",
-        "Yelp Top Rated",
-      ]}
-      title="Join the Community"
-      description="Connect with us on your preferred social platforms."
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterLogoReveal
-      logoText="Lumière Dining"
-      leftLink={{
-        text: "Privacy Policy",
-        href: "#",
-      }}
-      rightLink={{
-        text: "Terms of Use",
-        href: "#",
-      }}
-    />
-  </div>
       </ReactLenis>
     </ThemeProvider>
   );

src/app/gallery/page.tsx

@@ -2,12 +2,11 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
 
-export default function LandingPage() {
+export default function GalleryPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="elastic-effect"
@@ -22,116 +21,43 @@ export default function LandingPage() {
         headingFontWeight="medium"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
+        <div id="nav" data-section="nav">
-      <NavbarStyleCentered
+          <NavbarStyleCentered
-      navItems={[
+            navItems={[
-        {
+              { name: "Home", id: "/" },
-          name: "Home",
+              { name: "Menu", id: "/menu" },
-          id: "/",
+              { name: "Gallery", id: "/gallery" },
-        },
+              { name: "Reservations", id: "/reservations" },
-        {
+              { name: "Contact", id: "/contact" },
-          name: "Menu",
+            ]}
-          id: "/menu",
+            button={{ text: "Book Now", href: "/reservations" }}
-        },
+            brandName="Lumière Dining"
-        {
+          />
-          name: "Gallery",
+        </div>
-          id: "/gallery",
-        },
-        {
-          name: "Reservations",
-          id: "/reservations",
-        },
-        {
-          name: "Contact",
-          id: "/contact",
-        },
-      ]}
-      button={{
-        text: "Book Now",
-        href: "/reservations",
-      }}
-      brandName="Lumière Dining"
-    />
-  </div>
 
-  <div id="gallery-list" data-section="gallery-list">
+        <div id="gallery-content" className="pt-32 pb-20">
-      <ProductCardOne
+          <div className="container mx-auto px-6 text-center mb-16">
-      animationType="scale-rotate"
+            <h1 className="text-5xl font-bold mb-6">Culinary Immersive Gallery</h1>
-      textboxLayout="default"
+            <p className="text-xl max-w-2xl mx-auto">Explore our collection of signature seafood dishes, fresh ingredients, and elegant dining atmosphere.</p>
-      gridVariant="four-items-2x2-equal-grid"
+          </div>
-      useInvertedBackground={false}
+          <ProductCatalog 
-      products={[
+            layout="page" 
-        {
+            products={[
-          id: "g1",
+              { id: "1", category: "Seafood", name: "Pan-Seared Scallops", price: "$34", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fresh-shrimp-soaked-fish-sauce-thai-food_1150-22764.jpg" },
-          name: "Main Dining Room",
+              { id: "2", category: "Seafood", name: "Grilled Salmon", price: "$38", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fresh-shrimp-soaked-fish-sauce-thai-food_1150-22764.jpg?_wi=1" },
-          price: "",
+              { id: "3", category: "Atmosphere", name: "Lumière Interior", price: "", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/restaurant-dinner-table-with-plates-cutlery-yellow-blue-glasses_140725-8444.jpg" },
-          imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190934.jpg?_wi=1",
+              { id: "4", category: "Fine Dining", name: "Signature Appetizer", price: "$22", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/decorative-cake-slices-tray-orchid-flower-bouquet_23-2148028530.jpg" }
-        },
+            ]} 
-        {
+          />
-          id: "g2",
+        </div>
-          name: "The Open Kitchen",
-          price: "",
-          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-green-garlic-black-plate_23-2148425577.jpg?_wi=1",
-        },
-        {
-          id: "g3",
-          name: "Wine Selection",
-          price: "",
-          imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190962.jpg?_wi=1",
-        },
-        {
-          id: "g4",
-          name: "The Bar Lounge",
-          price: "",
-          imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190934.jpg?_wi=2",
-        },
-        {
-          id: "g5",
-          name: "Table Detail",
-          price: "",
-          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-green-garlic-black-plate_23-2148425577.jpg?_wi=2",
-        },
-        {
-          id: "g6",
-          name: "Chef's Plate",
-          price: "",
-          imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-night-having-dinner_23-2149190962.jpg?_wi=2",
-        },
-      ]}
-      title="Visual Story"
-      description="A glimpse into the ambiance and the art of our plates."
-    />
-  </div>
 
-  <div id="socialProof" data-section="socialProof">
+        <div id="footer" data-section="footer">
-      <SocialProofOne
+          <FooterLogoReveal
-      textboxLayout="default"
+            logoText="Lumière Dining"
-      useInvertedBackground={false}
+            leftLink={{ text: "Privacy Policy", href: "#" }}
-      names={[
+            rightLink={{ text: "Terms of Use", href: "#" }}
-        "Design Monthly",
+          />
-        "Architecture Digest",
+        </div>
-        "Art & Living",
-        "Interior Styles",
-        "Vogue Dining",
-      ]}
-      title="Accolades & Features"
-      description="Our space has been recognized for its unique atmosphere."
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterLogoReveal
-      logoText="Lumière Dining"
-      leftLink={{
-        text: "Privacy Policy",
-        href: "#",
-      }}
-      rightLink={{
-        text: "Terms of Use",
-        href: "#",
-      }}
-    />
-  </div>
       </ReactLenis>
     </ThemeProvider>
   );

src/app/menu/page.tsx

@@ -2,136 +2,52 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 
-export default function LandingPage() {
+export default function MenuPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="elastic-effect"
+      defaultButtonVariant="elastic-effect"
-        defaultTextAnimation="entrance-slide"
+      defaultTextAnimation="entrance-slide"
-        borderRadius="pill"
+      borderRadius="pill"
-        contentWidth="small"
+      contentWidth="medium"
-        sizing="largeSizeMediumTitles"
+      sizing="largeSizeMediumTitles"
-        background="floatingGradient"
+      background="floatingGradient"
-        cardStyle="subtle-shadow"
+      cardStyle="subtle-shadow"
-        primaryButtonStyle="diagonal-gradient"
+      primaryButtonStyle="diagonal-gradient"
-        secondaryButtonStyle="glass"
+      secondaryButtonStyle="glass"
-        headingFontWeight="medium"
+      headingFontWeight="medium"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
+        <NavbarStyleCentered
-      <NavbarStyleCentered
+          navItems={[
-      navItems={[
+            { name: "Home", id: "/" },
-        {
+            { name: "Menu", id: "/menu" },
-          name: "Home",
+            { name: "Gallery", id: "/gallery" },
-          id: "/",
+            { name: "Reservations", id: "/reservations" },
-        },
+            { name: "Contact", id: "/contact" },
-        {
+          ]}
-          name: "Menu",
+          button={{ text: "Book Now", href: "/reservations" }}
-          id: "/menu",
+          brandName="Lumière Dining"
-        },
+        />
-        {
+        <div className="pt-32 pb-20">
-          name: "Gallery",
+            <ProductCatalog 
-          id: "/gallery",
+                layout="page"
-        },
+                products={[
-        {
+                    { id: "m1", category: "Appetizers", name: "Seared Scallops with Saffron", price: "$24", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fresh-shrimp-soaked-fish-sauce-thai-food_1150-22764.jpg?_wi=1" },
-          name: "Reservations",
+                    { id: "m2", category: "Appetizers", name: "Oyster Selection", price: "$28", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/seafood-platter_1150-22764.jpg" },
-          id: "/reservations",
+                    { id: "m3", category: "Mains", name: "Pan-Seared Salmon", price: "$38", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fresh-shrimp-soaked-fish-sauce-thai-food_1150-22764.jpg?_wi=2" },
-        },
+                    { id: "m4", category: "Mains", name: "Lobster Thermidor", price: "$65", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/lobster-plate_23-2149021844.jpg" },
-        {
+                ]}
-          name: "Contact",
+            />
-          id: "/contact",
+        </div>
-        },
+        <FooterLogoReveal
-      ]}
+          logoText="Lumière Dining"
-      button={{
+          leftLink={{ text: "Privacy Policy", href: "#" }}
-        text: "Book Now",
+          rightLink={{ text: "Terms of Use", href: "#" }}
-        href: "/reservations",
+        />
-      }}
-      brandName="Lumière Dining"
-    />
-  </div>
-
-  <div id="menu-body" data-section="menu-body">
-      <ProductCardOne
-      animationType="opacity"
-      textboxLayout="default"
-      gridVariant="bento-grid"
-      useInvertedBackground={true}
-      products={[
-        {
-          id: "m1",
-          name: "Heritage Chicken",
-          price: "$32",
-          imageSrc: "http://img.b2bpic.net/free-photo/fresh-shrimp-soaked-fish-sauce-thai-food_1150-22764.jpg?_wi=3",
-        },
-        {
-          id: "m2",
-          name: "Wild Mushroom Risotto",
-          price: "$28",
-          imageSrc: "http://img.b2bpic.net/free-photo/cook-cutting-roasted-meat-board_23-2148040153.jpg?_wi=3",
-        },
-        {
-          id: "m3",
-          name: "Catch of the Day",
-          price: "$42",
-          imageSrc: "http://img.b2bpic.net/free-photo/decorative-cake-slices-tray-orchid-flower-bouquet_23-2148028530.jpg?_wi=2",
-        },
-        {
-          id: "m4",
-          name: "Roasted Root Vegetables",
-          price: "$16",
-          imageSrc: "http://img.b2bpic.net/free-photo/fresh-shrimp-soaked-fish-sauce-thai-food_1150-22764.jpg?_wi=4",
-        },
-        {
-          id: "m5",
-          name: "Artisan Cheese Plate",
-          price: "$24",
-          imageSrc: "http://img.b2bpic.net/free-photo/cook-cutting-roasted-meat-board_23-2148040153.jpg?_wi=4",
-        },
-        {
-          id: "m6",
-          name: "Valrhona Chocolate Mousse",
-          price: "$14",
-          imageSrc: "http://img.b2bpic.net/free-photo/decorative-cake-slices-tray-orchid-flower-bouquet_23-2148028530.jpg?_wi=3",
-        },
-      ]}
-      title="Full Seasonal Menu"
-      description="Explore our complete selection of artisanal dishes."
-    />
-  </div>
-
-  <div id="socialProof" data-section="socialProof">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      names={[
-        "Local Artisan",
-        "Organic Farms",
-        "Sustainability Union",
-        "City Harvest",
-        "Culinary Arts",
-      ]}
-      title="Our Sourcing Partners"
-      description="We partner with local farmers to ensure peak seasonal freshness."
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterLogoReveal
-      logoText="Lumière Dining"
-      leftLink={{
-        text: "Privacy Policy",
-        href: "#",
-      }}
-      rightLink={{
-        text: "Terms of Use",
-        href: "#",
-      }}
-    />
-  </div>
       </ReactLenis>
     </ThemeProvider>
   );

src/app/page.tsx

@@ -29,8 +29,6 @@ export default function LandingPage() {
       <NavbarStyleCentered
       navItems={[
         { name: "Home", id: "/" },
-        { name: "Menu", id: "/menu" },
-        { name: "Gallery", id: "/gallery" },
         { name: "Reservations", id: "/reservations" },
         { name: "Contact", id: "/contact" },
       ]}
@@ -96,10 +94,6 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="ecommerce" data-section="ecommerce">
-      <ProductCatalog layout="page" />
-  </div>
-
   <div id="footer" data-section="footer">
       <FooterLogoReveal
       logoText="Lumière Dining"

src/app/reservations/page.tsx

@@ -2,12 +2,11 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import ContactForm from '@/components/form/ContactForm';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 
-export default function LandingPage() {
+export default function ReservationsPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="elastic-effect"
@@ -22,80 +21,29 @@ export default function LandingPage() {
         headingFontWeight="medium"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
+        <NavbarStyleCentered
-      <NavbarStyleCentered
+          navItems={[
-      navItems={[
+            { name: "Home", id: "/" },
-        {
+            { name: "Reservations", id: "/reservations" },
-          name: "Home",
+            { name: "Contact", id: "/contact" },
-          id: "/",
+          ]}
-        },
+          button={{ text: "Book Now", href: "/reservations" }}
-        {
+          brandName="Lumière Dining"
-          name: "Menu",
+        />
-          id: "/menu",
+        <div className="pt-32 pb-20">
-        },
+            <ContactForm 
-        {
+                title="Book Your Table" 
-          name: "Gallery",
+                description="Secure your spot for an exquisite dining experience at Lumière."
-          id: "/gallery",
+                tag="Reservations"
-        },
+                buttonText="Reserve Table"
-        {
+                useInvertedBackground={false}
-          name: "Reservations",
+            />
-          id: "/reservations",
+        </div>
-        },
+        <FooterLogoReveal
-        {
+          logoText="Lumière Dining"
-          name: "Contact",
+          leftLink={{ text: "Privacy Policy", href: "#" }}
-          id: "/contact",
+          rightLink={{ text: "Terms of Use", href: "#" }}
-        },
+        />
-      ]}
-      button={{
-        text: "Book Now",
-        href: "/reservations",
-      }}
-      brandName="Lumière Dining"
-    />
-  </div>
-
-  <div id="reservation-form" data-section="reservation-form">
-      <ContactCenter
-      useInvertedBackground={true}
-      background={{
-        variant: "gradient-bars",
-      }}
-      tag="Booking"
-      title="Reserve Your Experience"
-      description="Secure your table for an evening of elegance."
-      buttonText="Confirm Booking"
-    />
-  </div>
-
-  <div id="socialProof" data-section="socialProof">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      names={[
-        "OpenTable Platinum",
-        "Resy Elite",
-        "Travel & Leisure",
-        "Michelin Pick",
-        "Local Favorite",
-      ]}
-      title="Trusted by Diners"
-      description="Recognized for seamless booking and elite guest experiences."
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterLogoReveal
-      logoText="Lumière Dining"
-      leftLink={{
-        text: "Privacy Policy",
-        href: "#",
-      }}
-      rightLink={{
-        text: "Terms of Use",
-        href: "#",
-      }}
-    />
-  </div>
       </ReactLenis>
     </ThemeProvider>
   );

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f5f4ef;
+  --background: #020617;
-  --card: #dad6cd;
+  --card: #0f172a;
-  --foreground: #2a2928;
+  --foreground: #e2e8f0;
-  --primary-cta: #2a2928;
+  --primary-cta: #c4d8f9;
   --primary-cta-text: #f5f4ef;
-  --secondary-cta: #ecebea;
+  --secondary-cta: #041633;
   --secondary-cta-text: #2a2928;
-  --accent: #ffffff;
+  --accent: #b8860b;
-  --background-accent: #c6b180;
+  --background-accent: #1d4ed8;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);