Add src/app/products/page.tsx

2026-06-03 13:55:41 +00:00
parent b3c551e8ad
commit e10449df98
1 changed files with 120 additions and 0 deletions
--- a/src/app/products/page.tsx
+++ b/src/app/products/page.tsx
@@ -0,0 +1,120 @@
+"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 FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function ProductsPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="background-highlight"
+        borderRadius="pill"
+        contentWidth="medium"
+        sizing="largeSmallSizeMediumTitles"
+        background="fluid"
+        cardStyle="outline"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="solid"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              {
+                name: "Home",          id: "/"},
+              {
+                name: "About",          id: "#about"},
+              {
+                name: "Features",          id: "#features"},
+              {
+                name: "Products",          id: "/products"},
+              {
+                name: "Services",          id: "#services"},
+              {
+                name: "Testimonials",          id: "#testimonials"},
+              {
+                name: "Contact",          id: "#contact"},
+            ]}
+            logoSrc="http://img.b2bpic.net/free-vector/20-onsolid-glyph-shopping-solid-glyph-icon-pack-like-shopping-online-shop-shop-ecommerce_1142-24155.jpg"
+            logoAlt="Luxuria Bazaar Logo"
+            brandName="Luxuria Bazaar"
+          />
+        </div>
+
+        <div id="products" data-section="products">
+          <ProductCardFour
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="two-columns-alternating-heights"
+            useInvertedBackground={true}
+            products={[
+              {
+                id: "prod-1",          name: "Zenith Chronograph",          price: "$7,500",          variant: "Rose Gold Edition",          imageSrc: "http://img.b2bpic.net/free-photo/metal-pieces-close-up-background_23-2148882603.jpg",          imageAlt: "Luxury Automatic Watch"},
+              {
+                id: "prod-2",          name: "Aura X Pro",          price: "$1,199",          variant: "Midnight Black",          imageSrc: "http://img.b2bpic.net/free-photo/modern-smartphone-with-live-abstract-wallpaper-coming-out-screen_23-2151033610.jpg",          imageAlt: "Premium Smartphone Aura X Pro"},
+              {
+                id: "prod-3",          name: "Opulence Silk Gown",          price: "$2,200",          variant: "Emerald Green",          imageSrc: "http://img.b2bpic.net/free-photo/elegant-mannequin-standing-modern-boutique-window-generated-by-ai_188544-34107.jpg",          imageAlt: "Designer Silk Gown"},
+              {
+                id: "prod-4",          name: "Harmonia Smart Hub",          price: "$349",          variant: "Lunar Silver",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-tablet_23-2148994134.jpg",          imageAlt: "Smart Home Hub"},
+              {
+                id: "prod-5",          name: "Minimalist Horizon",          price: "$450",          variant: "Leather Strap",          imageSrc: "http://img.b2bpic.net/free-photo/man-looking-time-his-wrist-watch_78826-2326.jpg",          imageAlt: "Minimalist Wristwatch"},
+              {
+                id: "prod-6",          name: "Sonic Aura Elite",          price: "$599",          variant: "Graphite Grey",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-with-headphones-outdoor_624325-1848.jpg",          imageAlt: "Premium Wireless Headphones"},
+            ]}
+            title="Our Exclusive Product Range"
+            description="Explore a diverse selection of premium items, from luxury watches to smart home devices, all crafted for discerning tastes and a sophisticated lifestyle."
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterSimple
+            columns={[
+              {
+                title: "Shop",          items: [
+                  {
+                    label: "Watches",              href: "/products"},
+                  {
+                    label: "Phones",              href: "/products"},
+                  {
+                    label: "Clothing",              href: "/products"},
+                  {
+                    label: "Electronics",              href: "/products"},
+                ],
+              },
+              {
+                title: "Company",          items: [
+                  {
+                    label: "About Us",              href: "#about"},
+                  {
+                    label: "Services",              href: "#services"},
+                  {
+                    label: "Testimonials",              href: "#testimonials"},
+                  {
+                    label: "FAQ",              href: "#faq"},
+                ],
+              },
+              {
+                title: "Support",          items: [
+                  {
+                    label: "Contact Us",              href: "#contact"},
+                  {
+                    label: "Shipping & Returns",              href: "#"},
+                  {
+                    label: "Privacy Policy",              href: "#"},
+                  {
+                    label: "Terms of Service",              href: "#"},
+                ],
+              },
+            ]}
+            bottomLeftText="© 2024 Luxuria Bazaar. All rights reserved."
+            bottomRightText="Crafted for the Discerning."
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}