Update src/app/page.tsx

Merge version_3 into main

src/app/about/page.tsx

@@ -0,0 +1,44 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import AboutMetric from "@/components/sections/about/AboutMetric";
+import { ChefHat, Sparkles, Award } from "lucide-react";
+
+export default function AboutPage() {
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "About", id: "/about" },
+    { name: "Contact", id: "/contact" }
+  ];
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="bounce-effect"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="compact"
+        sizing="mediumLargeSizeMediumTitles"
+        background="floatingGradient"
+        cardStyle="soft-shadow"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <NavbarStyleFullscreen navItems={navItems} brandName="ChefSelect" />
+        <AboutMetric 
+          title="Our Culinary Journey"
+          metrics={[
+            { icon: ChefHat, label: "Professional Chefs", value: "50+" },
+            { icon: Sparkles, label: "Events Served", value: "1,000+" },
+            { icon: Award, label: "Satisfied Clients", value: "99%" }
+          ]}
+          metricsAnimation="slide-up"
+          useInvertedBackground={false}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/catalog/page.tsx

@@ -0,0 +1,48 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import ProductCardFour from "@/components/sections/product/ProductCardFour";
+import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
+
+export default function CatalogPage() {
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "Catalog", id: "/catalog" }
+  ];
+
+  const products = [
+    { id: "1", name: "Signature Knife Set", price: "$299", variant: "Professional", imageSrc: "https://images.unsplash.com/photo-1593618998160-e34014d3e098?w=800&h=600" },
+    { id: "2", name: "Artisan Ceramic Bowl", price: "$45", variant: "Handmade", imageSrc: "https://images.unsplash.com/photo-1594971206138-c627f10b7842?w=800&h=600" },
+    { id: "3", name: "Cast Iron Skillet", price: "$120", variant: "Heritage", imageSrc: "https://images.unsplash.com/photo-1583394838336-acd977736f90?w=800&h=600" },
+    { id: "4", name: "Copper Mixing Bowls", price: "$185", variant: "Set of 3", imageSrc: "https://images.unsplash.com/photo-1603953531649-143003013824?w=800&h=600" }
+  ];
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="bounce-effect"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="compact"
+        sizing="mediumLargeSizeMediumTitles"
+        background="floatingGradient"
+        cardStyle="soft-shadow"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <NavbarStyleApple navItems={navItems} brandName="ChefSelect" />
+        <ProductCardFour
+          products={products}
+          gridVariant="four-items-2x2-equal-grid"
+          animationType="slide-up"
+          title="Our Culinary Catalog"
+          description="Discover our curated selection of professional kitchen essentials and artisan tools."
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/contact/page.tsx

@@ -0,0 +1,43 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
+
+export default function ContactPage() {
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "About", id: "/about" },
+    { name: "Contact", id: "/contact" }
+  ];
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="bounce-effect"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="compact"
+        sizing="mediumLargeSizeMediumTitles"
+        background="floatingGradient"
+        cardStyle="soft-shadow"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <NavbarStyleFullscreen navItems={navItems} brandName="ChefSelect" />
+        <ContactSplitForm
+          title="Get in Touch"
+          description="Have questions about our private dining services? We'd love to hear from you."
+          inputs={[
+            { name: "name", type: "text", placeholder: "Your Name", required: true },
+            { name: "email", type: "email", placeholder: "Your Email", required: true }
+          ]}
+          textarea={{ name: "message", placeholder: "How can we assist you?", rows: 4 }}
+          useInvertedBackground={false}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -2,8 +2,15 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
 
 export default function LandingPage() {
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "About", id: "/about" },
+    { name: "Contact", id: "/contact" }
+  ];
+
   return (
     <ThemeProvider
         defaultButtonVariant="bounce-effect"
@@ -18,8 +25,9 @@ export default function LandingPage() {
         headingFontWeight="extrabold"
     >
       <ReactLenis root>
+        <NavbarStyleFullscreen navItems={navItems} brandName="ChefSelect" />
         <div className="min-h-screen flex items-center justify-center">
-          <h1 className="text-4xl">Project Scrapped</h1>
+          <h1 className="text-4xl">Welcome to ChefSelect</h1>
         </div>
       </ReactLenis>
     </ThemeProvider>