Update src/app/products/page.tsx

Merge version_6 into main

src/app/page.tsx

@@ -31,21 +31,13 @@ export default function LandingPage() {
       <NavbarStyleCentered
       navItems={[
         {
-          name: "Shop",
+          name: "Shop",          id: "/products"},
-          id: "#products",
-        },
         {
-          name: "About",
+          name: "About",          id: "#about"},
-          id: "#about",
-        },
         {
-          name: "Gallery",
+          name: "Gallery",          id: "#gallery"},
-          id: "#gallery",
-        },
         {
-          name: "Contact",
+          name: "Contact",          id: "#contact"},
-          id: "#contact",
-        },
       ]}
       brandName="FKD WRLD"
     />
@@ -57,9 +49,7 @@ export default function LandingPage() {
       description="Crafting the future of premium streetwear. High-end silhouettes for the modern movement."
       buttons={[
         {
-          text: "Shop Now",
+          text: "Shop Now",          href: "/products"},
-          href: "#products",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-chair-inside_23-2149359824.jpg"
       imageAlt="FKD WRLD Hero Hoodie"
@@ -75,47 +65,17 @@ export default function LandingPage() {
       useInvertedBackground={false}
       products={[
         {
-          id: "p1",
+          id: "p1",          name: "Midnight Hoodie",          price: "$120",          variant: "Black",          imageSrc: "http://img.b2bpic.net/free-photo/woman-making-jacket-close-up_23-2148898084.jpg?_wi=1"},
-          name: "Midnight Hoodie",
-          price: "$120",
-          variant: "Black",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-making-jacket-close-up_23-2148898084.jpg",
-        },
         {
-          id: "p2",
+          id: "p2",          name: "Concrete Hoodie",          price: "$120",          variant: "Grey",          imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711559.jpg?_wi=1"},
-          name: "Concrete Hoodie",
-          price: "$120",
-          variant: "Grey",
-          imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711559.jpg",
-        },
         {
-          id: "p3",
+          id: "p3",          name: "Shadow Hoodie",          price: "$135",          variant: "Charcoal",          imageSrc: "http://img.b2bpic.net/free-photo/young-lady-oversized-hoodie-pants-holding-hands-head-looking-annoyed-front-view_176474-58539.jpg?_wi=1"},
-          name: "Shadow Hoodie",
-          price: "$135",
-          variant: "Charcoal",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-lady-oversized-hoodie-pants-holding-hands-head-looking-annoyed-front-view_176474-58539.jpg",
-        },
         {
-          id: "p4",
+          id: "p4",          name: "Graphic Icon",          price: "$145",          variant: "Black",          imageSrc: "http://img.b2bpic.net/free-vector/black-white-instagram-stories_79603-759.jpg?_wi=1"},
-          name: "Graphic Icon",
-          price: "$145",
-          variant: "Black",
-          imageSrc: "http://img.b2bpic.net/free-vector/black-white-instagram-stories_79603-759.jpg",
-        },
         {
-          id: "p5",
+          id: "p5",          name: "Essential Hoodie",          price: "$110",          variant: "Black",          imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-black-shirt_158595-1040.jpg"},
-          name: "Essential Hoodie",
-          price: "$110",
-          variant: "Black",
-          imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-young-magnificent-woman-black-shirt_158595-1040.jpg",
-        },
         {
-          id: "p6",
+          id: "p6",          name: "Core Essential",          price: "$110",          variant: "Grey",          imageSrc: "http://img.b2bpic.net/free-photo/teenager-wearing-white-hoodie-portrait_23-2149359831.jpg"},
-          name: "Core Essential",
-          price: "$110",
-          variant: "Grey",
-          imageSrc: "http://img.b2bpic.net/free-photo/teenager-wearing-white-hoodie-portrait_23-2149359831.jpg",
-        },
       ]}
       title="Featured Collection"
       description="Premium oversized hoodies, redefined for the streets."
@@ -129,17 +89,11 @@ export default function LandingPage() {
       description="FKD WRLD isn't just a brand; it's a movement. We merge architectural cuts with high-end fabrications to deliver streetwear that commands attention."
       metrics={[
         {
-          value: "100%",
+          value: "100%",          title: "Heavy Cotton"},
-          title: "Heavy Cotton",
-        },
         {
-          value: "24/7",
+          value: "24/7",          title: "Street Ready"},
-          title: "Street Ready",
-        },
         {
-          value: "Ltd",
+          value: "Ltd",          title: "Drops"},
-          title: "Drops",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/sensual-girl-all-black-red-lips-hat-goth-dramatic-woman-hold-white-chrysanthemum-flower-against-graffiti-wall_627829-6268.jpg"
       imageAlt="Streetwear Lifestyle"
@@ -155,26 +109,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       metrics={[
         {
-          id: "g1",
+          id: "g1",          value: "City",          title: "Tokyo Nights",          description: "Urban exploration.",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-posing-outdoors_23-2150204396.jpg"},
-          value: "City",
-          title: "Tokyo Nights",
-          description: "Urban exploration.",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-posing-outdoors_23-2150204396.jpg",
-        },
         {
-          id: "g2",
+          id: "g2",          value: "Culture",          title: "Studio Sessions",          description: "Creative process.",          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-friends-posing-night-with-flash_23-2150204453.jpg"},
-          value: "Culture",
-          title: "Studio Sessions",
-          description: "Creative process.",
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-friends-posing-night-with-flash_23-2150204453.jpg",
-        },
         {
-          id: "g3",
+          id: "g3",          value: "Brand",          title: "FKD Aesthetic",          description: "Defined by us.",          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-new-york-city-daytime_23-2149488557.jpg"},
-          value: "Brand",
-          title: "FKD Aesthetic",
-          description: "Defined by us.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-new-york-city-daytime_23-2149488557.jpg",
-        },
       ]}
       title="Lifestyle Gallery"
       description="From the streets to the studio. Always FKD."
@@ -189,45 +128,20 @@ export default function LandingPage() {
       useInvertedBackground={true}
       testimonials={[
         {
-          id: "t1",
+          id: "t1",          name: "Jax S.",          role: "Creative",          company: "FKD Crew",          rating: 5,
-          name: "Jax S.",
+          imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-man-with-long-blonde-hair-wearing-red-jacket_23-2149020151.jpg"},
-          role: "Creative",
-          company: "FKD Crew",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-man-with-long-blonde-hair-wearing-red-jacket_23-2149020151.jpg",
-        },
         {
-          id: "t2",
+          id: "t2",          name: "Mina K.",          role: "Stylist",          company: "FKD Crew",          rating: 5,
-          name: "Mina K.",
+          imageSrc: "http://img.b2bpic.net/free-photo/outdoor-shot-curly-haired-woman-wears-sunglasses-jacket-hoodie-checks-time-smartwatch-spends-free-time-walking-city-sunny-weather-uses-application-modern-lifestyle-concept_273609-60619.jpg"},
-          role: "Stylist",
-          company: "FKD Crew",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/outdoor-shot-curly-haired-woman-wears-sunglasses-jacket-hoodie-checks-time-smartwatch-spends-free-time-walking-city-sunny-weather-uses-application-modern-lifestyle-concept_273609-60619.jpg",
-        },
         {
-          id: "t3",
+          id: "t3",          name: "Leo B.",          role: "Producer",          company: "FKD Crew",          rating: 5,
-          name: "Leo B.",
+          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-outside_23-2149439874.jpg"},
-          role: "Producer",
-          company: "FKD Crew",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-outside_23-2149439874.jpg",
-        },
         {
-          id: "t4",
+          id: "t4",          name: "Sara D.",          role: "Designer",          company: "FKD Crew",          rating: 5,
-          name: "Sara D.",
+          imageSrc: "http://img.b2bpic.net/free-photo/fashion-glamour-woman-trendy-fur-coat-glasses-with-gold-jewelry-posing-city_291650-702.jpg"},
-          role: "Designer",
-          company: "FKD Crew",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/fashion-glamour-woman-trendy-fur-coat-glasses-with-gold-jewelry-posing-city_291650-702.jpg",
-        },
         {
-          id: "t5",
+          id: "t5",          name: "Ren M.",          role: "Model",          company: "FKD Crew",          rating: 5,
-          name: "Ren M.",
+          imageSrc: "http://img.b2bpic.net/free-photo/pop-punk-aesthetic-portrait-woman-posing-inside-building_23-2149371489.jpg"},
-          role: "Model",
-          company: "FKD Crew",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/pop-punk-aesthetic-portrait-woman-posing-inside-building_23-2149371489.jpg",
-        },
       ]}
       title="Community Voices"
       description="Hear what the movement thinks."
@@ -240,20 +154,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "f1",
+          id: "f1",          title: "Shipping times?",          content: "Orders ship within 48 hours."},
-          title: "Shipping times?",
-          content: "Orders ship within 48 hours.",
-        },
         {
-          id: "f2",
+          id: "f2",          title: "Sizing guide?",          content: "Our hoodies are oversized. Size down for regular fit."},
-          title: "Sizing guide?",
-          content: "Our hoodies are oversized. Size down for regular fit.",
-        },
         {
-          id: "f3",
+          id: "f3",          title: "Returns policy?",          content: "Free returns within 30 days."},
-          title: "Returns policy?",
-          content: "Free returns within 30 days.",
-        },
       ]}
       title="Common Inquiries"
       description="Everything you need to know about your order."
@@ -265,16 +170,13 @@ export default function LandingPage() {
       <ContactCTA
       useInvertedBackground={true}
       background={{
-        variant: "plain",
+        variant: "plain"}}
-      }}
       tag="FKD CLUB"
       title="Stay Informed"
       description="Join our newsletter for early access to limited drops."
       buttons={[
         {
-          text: "Join Club",
+          text: "Join Club",          href: "#"},
-          href: "#",
-        },
       ]}
     />
   </div>
@@ -283,16 +185,13 @@ export default function LandingPage() {
       <ContactCTA
       useInvertedBackground={false}
       background={{
-        variant: "plain",
+        variant: "plain"}}
-      }}
       tag="SUPPORT"
       title="Get In Touch"
       description="Questions about your order? We're here for you."
       buttons={[
         {
-          text: "Email Us",
+          text: "Email Us",          href: "mailto:hello@fkdwrld.com"},
-          href: "mailto:hello@fkdwrld.com",
-        },
       ]}
     />
   </div>
@@ -302,29 +201,19 @@ export default function LandingPage() {
       logoText="FKD WRLD"
       columns={[
         {
-          title: "Links",
+          title: "Links",          items: [
-          items: [
             {
-              label: "Shop",
+              label: "Shop",              href: "/products"},
-              href: "#products",
-            },
             {
-              label: "About",
+              label: "About",              href: "#about"},
-              href: "#about",
-            },
           ],
         },
         {
-          title: "Social",
+          title: "Social",          items: [
-          items: [
             {
-              label: "Instagram",
+              label: "Instagram",              href: "https://instagram.com"},
-              href: "https://instagram.com",
-            },
             {
-              label: "TikTok",
+              label: "TikTok",              href: "https://tiktok.com"},
-              href: "https://tiktok.com",
-            },
           ],
         },
       ]}

src/app/products/page.tsx

@@ -0,0 +1,66 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+export default function ProductsPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="rounded"
+        contentWidth="mediumLarge"
+        sizing="medium"
+        background="noiseDiagonalGradient"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="shadow"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Shop", id: "/products" },
+              { name: "About", id: "/#about" },
+              { name: "Gallery", id: "/#gallery" },
+              { name: "Contact", id: "/#contact" },
+            ]}
+            brandName="FKD WRLD"
+          />
+        </div>
+
+        <div id="products" data-section="products">
+          <ProductCardFour
+            animationType="slide-up"
+            textboxLayout="split"
+            gridVariant="four-items-2x2-equal-grid"
+            useInvertedBackground={false}
+            products={[
+              { id: "p1", name: "Midnight Hoodie", price: "$120", variant: "Black", imageSrc: "http://img.b2bpic.net/free-photo/woman-making-jacket-close-up_23-2148898084.jpg?_wi=2" },
+              { id: "p2", name: "Concrete Hoodie", price: "$120", variant: "Grey", imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711559.jpg?_wi=2" },
+              { id: "p3", name: "Shadow Hoodie", price: "$135", variant: "Charcoal", imageSrc: "http://img.b2bpic.net/free-photo/young-lady-oversized-hoodie-pants-holding-hands-head-looking-annoyed-front-view_176474-58539.jpg?_wi=2" },
+              { id: "p4", name: "Graphic Icon", price: "$145", variant: "Black", imageSrc: "http://img.b2bpic.net/free-vector/black-white-instagram-stories_79603-759.jpg?_wi=2" }
+            ]}
+            title="All Collections"
+            description="Explore our full range of premium streetwear essentials."
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBaseCard
+            logoText="FKD WRLD"
+            columns={[
+              { title: "Links", items: [{ label: "Shop", href: "/products" }, { label: "About", href: "/#about" }] },
+              { title: "Social", items: [{ label: "Instagram", href: "https://instagram.com" }, { label: "TikTok", href: "https://tiktok.com" }] }
+            ]}
+            copyrightText="© 2025 | FKD WRLD"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}