Add src/app/products/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -32,16 +32,11 @@ export default function LandingPage() {
   <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"},
+        { name: "Features", id: "#features" },
+        { name: "About", id: "#about" },
+        { name: "Products", id: "/products" },
+        { name: "Testimonials", id: "#testimonials" },
+        { name: "Contact", id: "#contact" },
       ]}
       brandName="Stellamart"
     />
@@ -49,16 +44,13 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboardScroll
-      background={{
-        variant: "gradient-bars"}}
+      background={{ 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: "Learn More",          href: "#about"},
+        { text: "Explore Marketplace", 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"
@@ -72,15 +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: 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."},
+        { icon: Zap, title: "Instant Delivery", 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."
@@ -107,62 +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: "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: "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: "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" },
       ]}
       kpiItems={[
-        {
-          value: "10k+",          label: "Products Sold"},
-        {
-          value: "5k+",          label: "Happy Clients"},
-        {
-          value: "99%",          label: "Satisfaction Rate"},
+        { value: "10k+", label: "Products Sold" },
+        { 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="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="Latest Tech Gadgets"
-      description="Elevate your setup with the newest devices available at Stellamart."
-    />
-  </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: "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"},
+        { 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: "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."
@@ -174,12 +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: "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: "f1", title: "What payment methods do you accept?", 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." },
       ]}
       title="Frequently Asked Questions"
       description="Everything you need to know about our marketplace and products."
@@ -190,37 +140,19 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactCTA
       useInvertedBackground={false}
-      background={{
-        variant: "plain"}}
+      background={{ variant: "plain" }}
       tag="Get in touch"
       title="Ready to get started?"
       description="Have questions or need assistance? Reach out today."
-      buttons={[
-        {
-          text: "Contact Support",          href: "mailto:support@stellamart.web"},
-      ]}
+      buttons={[ { 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: [
-            {
-              label: "About",              href: "#about"},
-            {
-              label: "Privacy",              href: "#"},
-          ],
-        },
+        { items: [ { label: "Marketplace", href: "/products" }, { label: "Support", href: "#contact" } ] },
+        { items: [ { label: "About", href: "#about" }, { label: "Privacy", href: "#" } ] },
       ]}
       logoText="Stellamart"
     />
@@ -228,4 +160,5 @@ export default function LandingPage() {
       </ReactLenis>
     </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>
+  );
+}