Add src/app/products/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -32,26 +32,11 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Features", id: "#features" },
-          name: "Features",
+        { name: "About", id: "#about" },
-          id: "#features",
+        { name: "Products", id: "/products" },
-        },
+        { name: "Testimonials", id: "#testimonials" },
-        {
+        { name: "Contact", id: "#contact" },
-          name: "About",
-          id: "#about",
-        },
-        {
-          name: "Products",
-          id: "#products",
-        },
-        {
-          name: "Testimonials",
-          id: "#testimonials",
-        },
-        {
-          name: "Contact",
-          id: "#contact",
-        },
       ]}
       brandName="Stellamart"
     />
@@ -59,21 +44,13 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboardScroll
-      background={{
+      background={{ variant: "gradient-bars" }}
-        variant: "gradient-bars",
-      }}
       title="Empowering Your Digital Journey"
       description="Discover high-quality digital assets, templates, and software solutions designed to accelerate your creative workflow."
       tag="New Arrivals"
       buttons={[
-        {
+        { text: "Explore Marketplace", href: "/products" },
-          text: "Explore Marketplace",
+        { text: "Learn More", href: "#about" },
-          href: "#products",
-        },
-        {
-          text: "Learn More",
-          href: "#about",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/man-innovating-wind-energy-virtual-reality-world_23-2148820137.jpg"
       imageAlt="digital products marketplace technology"
@@ -87,21 +64,9 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       features={[
-        {
+        { icon: Zap, title: "Instant Delivery", description: "Get access to your digital files immediately after purchase." },
-          icon: Zap,
+        { icon: Shield, title: "Secure Transactions", description: "Every purchase is protected with robust encryption technology." },
-          title: "Instant Delivery",
+        { icon: CheckCircle, title: "Verified Quality", description: "All products undergo a rigorous verification process before publishing." },
-          description: "Get access to your digital files immediately after purchase.",
-        },
-        {
-          icon: Shield,
-          title: "Secure Transactions",
-          description: "Every purchase is protected with robust encryption technology.",
-        },
-        {
-          icon: CheckCircle,
-          title: "Verified Quality",
-          description: "All products undergo a rigorous verification process before publishing.",
-        },
       ]}
       title="Why Choose Stellamart?"
       description="Our platform ensures the highest standards for all digital products we distribute."
@@ -128,156 +93,29 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "1", name: "Sarah Miller", role: "Designer", company: "CreativeFlow", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/glad-young-man-with-african-hairstyle-posing-with-arms-crossed-his-office-with-other-employees-male-manager-blue-shirt-smiling-conference-workplace_197531-3748.jpg", imageAlt: "portrait diverse young professional" },
-          id: "1",
+        { id: "2", name: "David Chen", role: "Developer", company: "CodeLabs", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-happy-gorgeous-woman-with-relaxed-smile-spending-nice-time-cafe_273609-9043.jpg", imageAlt: "portrait diverse young professional" },
-          name: "Sarah Miller",
+        { id: "3", name: "Emily Watson", role: "Marketer", company: "GrowthCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-spectacular-woman-laughing-front_197531-19644.jpg", imageAlt: "portrait diverse young professional" },
-          role: "Designer",
-          company: "CreativeFlow",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/glad-young-man-with-african-hairstyle-posing-with-arms-crossed-his-office-with-other-employees-male-manager-blue-shirt-smiling-conference-workplace_197531-3748.jpg",
-          imageAlt: "portrait diverse young professional",
-        },
-        {
-          id: "2",
-          name: "David Chen",
-          role: "Developer",
-          company: "CodeLabs",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-happy-gorgeous-woman-with-relaxed-smile-spending-nice-time-cafe_273609-9043.jpg",
-          imageAlt: "portrait diverse young professional",
-        },
-        {
-          id: "3",
-          name: "Emily Watson",
-          role: "Marketer",
-          company: "GrowthCo",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-spectacular-woman-laughing-front_197531-19644.jpg",
-          imageAlt: "portrait diverse young professional",
-        },
-        {
-          id: "4",
-          name: "Alex Smith",
-          role: "Founder",
-          company: "StartUp",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-successful-businessman-with-trendy-hairdo-frowns-face-with-pleasure_273609-8674.jpg",
-          imageAlt: "portrait diverse young professional",
-        },
-        {
-          id: "5",
-          name: "Jordan P.",
-          role: "Agency Lead",
-          company: "DigitalArt",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/middle-age-hispanic-woman-smiling-confident-standing-street_839833-27516.jpg",
-          imageAlt: "portrait diverse young professional",
-        },
       ]}
       kpiItems={[
-        {
+        { value: "10k+", label: "Products Sold" },
-          value: "10k+",
+        { value: "5k+", label: "Happy Clients" },
-          label: "Products Sold",
+        { value: "99%", label: "Satisfaction Rate" },
-        },
-        {
-          value: "5k+",
-          label: "Happy Clients",
-        },
-        {
-          value: "99%",
-          label: "Satisfaction Rate",
-        },
       ]}
       title="Trusted by Creators"
       description="See why top professionals choose our platform for their digital asset needs."
     />
   </div>
 
-  <div id="products" data-section="products">
-      <ProductCardThree
-      animationType="slide-up"
-      textboxLayout="split"
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={true}
-      products={[
-        {
-          id: "1",
-          name: "UI Starter Kit",
-          price: "$49",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-glasses-camera-arrangement_23-2149558789.jpg",
-          imageAlt: "digital ui kit branding product",
-        },
-        {
-          id: "2",
-          name: "Vector Icon Set",
-          price: "$29",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-landscape-extruding-hexagons_1048-14069.jpg",
-          imageAlt: "digital icon pack branding product",
-        },
-        {
-          id: "3",
-          name: "SaaS Template",
-          price: "$89",
-          imageSrc: "http://img.b2bpic.net/free-photo/usb-type-c-port-warm-neon-scene-tech-macro_169016-71583.jpg",
-          imageAlt: "digital template mockup visual",
-        },
-        {
-          id: "4",
-          name: "Stock Photo Pack",
-          price: "$39",
-          imageSrc: "http://img.b2bpic.net/free-vector/multimedia-hand-drawn-icon-web-print-mobile-uxui-kit-such-as-media-mic-microphone-sound-control-fast-forward-media-pictogram-pack-vector_1057-11184.jpg",
-          imageAlt: "digital photography asset branding",
-        },
-        {
-          id: "5",
-          name: "3D Asset Suite",
-          price: "$129",
-          imageSrc: "http://img.b2bpic.net/free-photo/flying-rings-geometric-shapes-background_23-2148772500.jpg",
-          imageAlt: "digital 3d object asset branding",
-        },
-        {
-          id: "6",
-          name: "Digital Planner",
-          price: "$19",
-          imageSrc: "http://img.b2bpic.net/free-photo/tablet-near-smartphone-papers-pencils-clips_23-2148036876.jpg",
-          imageAlt: "digital productivity planner mockup",
-        },
-      ]}
-      title="Featured Digital Products"
-      description="Explore our top-selling digital assets for every stage of your creative project."
-    />
-  </div>
-
   <div id="metrics" data-section="metrics">
       <MetricCardEleven
       animationType="slide-up"
       textboxLayout="split"
       useInvertedBackground={false}
       metrics={[
-        {
+        { id: "m1", value: "500+", title: "Active Creators", description: "Industry leading contributors", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-nutritional-counter-app-composition_23-2149880606.jpg", imageAlt: "digital ui kit branding product" },
-          id: "m1",
+        { id: "m2", value: "2.5M+", title: "Assets Provided", description: "High resolution resources", imageSrc: "http://img.b2bpic.net/free-vector/design-thinking-d-printing-modeling-25-flat-color-icon-pack-including-screen-fly-wireframing-wallpaper-brusher_1142-24835.jpg", imageAlt: "digital icon pack branding product" },
-          value: "500+",
+        { id: "m3", value: "95%", title: "Retention Rate", description: "Returning happy customers", imageSrc: "http://img.b2bpic.net/free-photo/english-book-resting-table-working-space_23-2149429618.jpg", imageAlt: "digital template mockup visual" },
-          title: "Active Creators",
-          description: "Industry leading contributors",
-          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-nutritional-counter-app-composition_23-2149880606.jpg",
-          imageAlt: "digital ui kit branding product",
-        },
-        {
-          id: "m2",
-          value: "2.5M+",
-          title: "Assets Provided",
-          description: "High resolution resources",
-          imageSrc: "http://img.b2bpic.net/free-vector/design-thinking-d-printing-modeling-25-flat-color-icon-pack-including-screen-fly-wireframing-wallpaper-brusher_1142-24835.jpg",
-          imageAlt: "digital icon pack branding product",
-        },
-        {
-          id: "m3",
-          value: "95%",
-          title: "Retention Rate",
-          description: "Returning happy customers",
-          imageSrc: "http://img.b2bpic.net/free-photo/english-book-resting-table-working-space_23-2149429618.jpg",
-          imageAlt: "digital template mockup visual",
-        },
       ]}
       title="By The Numbers"
       description="Our growth and impact speak volumes about our commitment to excellence."
@@ -289,26 +127,9 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={true}
       faqs={[
-        {
+        { id: "f1", title: "What payment methods do you accept?", content: "We accept major credit cards, PayPal, and Apple Pay." },
-          id: "f1",
+        { id: "f2", title: "Can I get a refund?", content: "Refunds are processed based on our fair return policy." },
-          title: "What payment methods do you accept?",
+        { id: "f3", title: "How do I download my files?", content: "You will receive an instant download link via email after purchase." },
-          content: "We accept major credit cards, PayPal, and Apple Pay.",
-        },
-        {
-          id: "f2",
-          title: "Can I get a refund?",
-          content: "Refunds are processed based on our fair return policy.",
-        },
-        {
-          id: "f3",
-          title: "How do I download my files?",
-          content: "You will receive an instant download link via email after purchase.",
-        },
-        {
-          id: "f4",
-          title: "Do you provide support?",
-          content: "Yes, our dedicated support team is available 24/7.",
-        },
       ]}
       title="Frequently Asked Questions"
       description="Everything you need to know about our marketplace and products."
@@ -319,48 +140,19 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCTA
       useInvertedBackground={false}
-      background={{
+      background={{ variant: "plain" }}
-        variant: "plain",
-      }}
       tag="Get in touch"
       title="Ready to get started?"
       description="Have questions or need assistance? Reach out today."
-      buttons={[
+      buttons={[ { text: "Contact Support", href: "mailto:support@stellamart.web" } ]}
-        {
-          text: "Contact Support",
-          href: "mailto:support@stellamart.web",
-        },
-      ]}
     />
   </div>
 
   <div id="footer" data-section="footer">
       <FooterLogoEmphasis
       columns={[
-        {
+        { items: [ { label: "Marketplace", href: "/products" }, { label: "Support", href: "#contact" } ] },
-          items: [
+        { items: [ { label: "About", href: "#about" }, { label: "Privacy", href: "#" } ] },
-            {
-              label: "Marketplace",
-              href: "#products",
-            },
-            {
-              label: "Support",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "About",
-              href: "#about",
-            },
-            {
-              label: "Privacy",
-              href: "#",
-            },
-          ],
-        },
       ]}
       logoText="Stellamart"
     />
@@ -369,3 +161,4 @@ export default function LandingPage() {
     </ThemeProvider>
   );
 }
+    

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 ProductCardThree from '@/components/sections/product/ProductCardThree';
+import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+
+export default function ProductsPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="expand-hover"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="pill"
+        contentWidth="mediumSmall"
+        sizing="mediumLargeSizeMediumTitles"
+        background="floatingGradient"
+        cardStyle="layered-gradient"
+        primaryButtonStyle="shadow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="light"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarStyleCentered
+                navItems={[
+                    { name: "Features", id: "/#features" },
+                    { name: "About", id: "/#about" },
+                    { name: "Products", id: "/products" },
+                    { name: "Testimonials", id: "/#testimonials" },
+                    { name: "Contact", id: "/#contact" },
+                ]}
+                brandName="Stellamart"
+            />
+        </div>
+
+        <div id="products" data-section="products" className="py-20">
+            <ProductCardThree
+                animationType="slide-up"
+                textboxLayout="split"
+                gridVariant="four-items-2x2-equal-grid"
+                useInvertedBackground={true}
+                products={[
+                    { id: "1", name: "PS5 Console Digital Edition", price: "$499", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DXxgZnAO7ALXhsAQiejvZJgYif/uploaded-1778459767638-icbp42u5.webp", imageAlt: "PS5 console" },
+                    { id: "2", name: "Samsung Galaxy Tab S9", price: "$799", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DXxgZnAO7ALXhsAQiejvZJgYif/uploaded-1778459875386-rkcr9zas.avif", imageAlt: "samsung galaxy tab" },
+                    { id: "3", name: "iPhone 15 Pro", price: "$999", imageSrc: "http://img.b2bpic.net/free-photo/usb-type-c-port-warm-neon-scene-tech-macro_169016-71583.jpg", imageAlt: "iphone 15 pro" },
+                    { id: "4", name: "Ultrabook Pro 15", price: "$1299", imageSrc: "http://img.b2bpic.net/free-photo/tablet-near-smartphone-papers-pencils-clips_23-2148036876.jpg", imageAlt: "high performance laptop" },
+                ]}
+                title="Our Digital Products"
+                description="Explore our full catalog of high-performance tech gadgets and digital assets."
+            />
+        </div>
+
+        <div id="footer" data-section="footer">
+            <FooterLogoEmphasis
+                columns={[
+                    { items: [ { label: "Marketplace", href: "/products" }, { label: "Support", href: "/#contact" } ] },
+                    { items: [ { label: "About", href: "/#about" }, { label: "Privacy", href: "#" } ] },
+                ]}
+                logoText="Stellamart"
+            />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}