Add src/app/product/page.tsx

2026-03-30 23:18:35 +00:00
parent cf9e2feaba
commit 76f6ffddc8
1 changed files with 102 additions and 0 deletions
--- a/src/app/product/page.tsx
+++ b/src/app/product/page.tsx
@@ -0,0 +1,102 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
+import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import { ShieldCheck, Truck, BookOpen, AlertCircle } from "lucide-react";
+
+export default function ProductPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="compact"
+        sizing="medium"
+        background="none"
+        cardStyle="layered-gradient"
+        primaryButtonStyle="shadow"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingOverlay
+                navItems={[{ name: "Home", id: "/" }]}
+                brandName="GameVault"
+            />
+        </div>
+
+        <div id="hero" data-section="hero">
+            <HeroLogoBillboard
+                logoText="Product Details"
+                description="Comprehensive information, delivery guidelines, and security verification for your selected item."
+                buttons={[{ text: "Back to Shop", href: "/" }]}
+                background={{ variant: "gradient-bars" }}
+            />
+        </div>
+
+        <div id="details" data-section="details">
+            <FeatureCardNine
+                showStepNumbers={true}
+                title="Product Description"
+                description="Learn exactly what is included in your purchase and how to access your digital assets."
+                textboxLayout="split"
+                useInvertedBackground={false}
+                animationType="slide-up"
+                features={[
+                    {
+                        id: 1,
+                        title: "What's Included",                        description: "Full access credentials, lifetime warranty, and premium support access.",                        phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgYwGFqLSGO5c7lb52cFzruK2R/high-quality-cover-art-for-a-gta-rp-pack-1774912526911-af715fe4.png?_wi=1" },
+                        phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgYwGFqLSGO5c7lb52cFzruK2R/high-quality-cover-art-for-a-steam-accou-1774912526776-d45bdfc6.png?_wi=1" }
+                    }
+                ]}
+            />
+        </div>
+
+        <div id="delivery" data-section="delivery">
+            <FeatureCardNine
+                showStepNumbers={true}
+                title="Delivery Process"
+                description="Our automated delivery system ensures you get your product fast and securely."
+                textboxLayout="split"
+                useInvertedBackground={true}
+                animationType="slide-up"
+                features={[
+                    {
+                        id: 2,
+                        title: "Instant Delivery",                        description: "Receive your account details via email immediately after payment verification.",                        phoneOne: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgYwGFqLSGO5c7lb52cFzruK2R/high-quality-cover-art-for-a-digital-vid-1774912526239-b751543e.png?_wi=2" },
+                        phoneTwo: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BgYwGFqLSGO5c7lb52cFzruK2R/high-quality-cover-art-for-a-steam-accou-1774912526776-d45bdfc6.png?_wi=2" }
+                    }
+                ]}
+            />
+        </div>
+
+        <div id="faq" data-section="faq">
+            <FaqSplitMedia
+                title="Instructions & Security"
+                description="How to activate your product and our security guarantees."
+                textboxLayout="split"
+                faqsAnimation="slide-up"
+                faqs={[
+                    { id: "s1", title: "How do I activate?", content: "Follow the instructions sent to your email after checkout." },
+                    { id: "s2", title: "Is it secure?", content: "We use encrypted transactions and verified account sources." }
+                ]}
+            />
+        </div>
+
+        <div id="footer" data-section="footer">
+            <FooterLogoReveal
+                logoText="GameVault"
+                leftLink={{ text: "Support", href: "#" }}
+                rightLink={{ text: "Safety", href: "#" }}
+            />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}