Add src/app/product/[id]/page.tsx

src/app/product/[id]/page.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+// NOTE: This is a placeholder for the Product Detail Page structure requested.
+export default function ProductDetailPage({ params }: { params: { id: string } }) {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="background-highlight"
+        borderRadius="pill"
+        contentWidth="smallMedium"
+        sizing="large"
+        background="blurBottom"
+        cardStyle="solid"
+        primaryButtonStyle="double-inset"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarStyleCentered
+            navItems={[
+                { name: "Home", id: "/" },
+                { name: "Shop", id: "/#products" },
+                { name: "Contact", id: "/#contact" },
+            ]}
+            brandName="SwiftMarket"
+            />
+        </div>
+        
+        <main className="py-20 px-6 max-w-7xl mx-auto">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-12">
+                <div className="bg-gray-100 rounded-2xl min-h-[400px] flex items-center justify-center">
+                    <span className="text-gray-400">Product Image Gallery</span>
+                </div>
+                <div>
+                    <h1 className="text-4xl font-extrabold mb-4">Product Title</h1>
+                    <p className="text-2xl font-bold text-primary mb-6">$199.00</p>
+                    <p className="text-lg text-gray-600 mb-8">Detailed product description goes here, explaining all the features and benefits.</p>
+                    <button className="px-8 py-4 bg-primary text-white rounded-full font-bold shadow-lg hover:opacity-90">
+                        Add to Cart
+                    </button>
+                </div>
+            </div>
+
+            <section className="mt-20">
+                <h2 className="text-3xl font-bold mb-8">Reviews & Ratings</h2>
+                <div className="p-6 border border-gray-200 rounded-2xl">
+                    <p>No reviews yet.</p>
+                </div>
+            </section>
+        </main>
+
+        <div id="footer" data-section="footer">
+            <FooterBaseCard
+            logoText="SwiftMarket"
+            columns={[
+                { title: "Company", items: [{ label: "About", href: "#" }, { label: "Careers", href: "#" }] },
+                { title: "Support", items: [{ label: "Help Center", href: "#" }, { label: "FAQ", href: "#" }] },
+            ]}
+            />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}