Update src/app/landing/page.tsx

Merge version_2 into main

src/app/landing/page.tsx

@@ -0,0 +1,110 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import HeroPersonalLinks from '@/components/sections/hero/HeroPersonalLinks';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { Rocket, Shield, BatteryCharging } from "lucide-react";
+
+export default function LandingPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="background-highlight"
+        borderRadius="pill"
+        contentWidth="smallMedium"
+        sizing="largeSmall"
+        background="noiseDiagonalGradient"
+        cardStyle="gradient-bordered"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="layered"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+  <div id="nav" data-section="nav">
+      <NavbarLayoutFloatingOverlay
+      navItems={[
+        {
+          name: "Home",          id: "/"},
+        {
+          name: "Landing",          id: "/landing"},
+        {
+          name: "Product",          id: "/product"},
+        {
+          name: "Contact",          id: "#contact"}
+      ]}
+      brandName="Nova Device"
+      button={{
+        text: "Get Started",        href: "/product"}}
+    />
+  </div>
+
+  <div id="hero" data-section="hero">
+      <HeroPersonalLinks
+      background={{
+        variant: "radial-gradient"}}
+      title="Your Gateway to Innovation"
+      linkCards={[
+        {
+          icon: Rocket,
+          title: "Blazing Fast Performance",          description: "Experience lightning-fast speeds and seamless multitasking with our optimized hardware.",          button: { text: "Learn More", href: "/product" }
+        },
+        {
+          icon: Shield,
+          title: "Unrivaled Security",          description: "Your data is protected with state-of-the-art encryption and advanced privacy features.",          button: { text: "Learn More", href: "/product" }
+        },
+        {
+          icon: BatteryCharging,
+          title: "All-Day Battery Life",          description: "Power through your entire day without needing a recharge, even with heavy usage.",          button: { text: "Learn More", href: "/product" }
+        }
+      ]}
+    />
+  </div>
+
+  <div id="footer" data-section="footer">
+      <FooterSimple
+      columns={[
+        {
+          title: "Product",          items: [
+            {
+              label: "Pricing",              href: "#"}
+          ]
+        },
+        {
+          title: "Company",          items: [
+            {
+              label: "About Us",              href: "#"},
+            {
+              label: "Careers",              href: "#"},
+            {
+              label: "Press",              href: "#"}
+          ]
+        },
+        {
+          title: "Support",          items: [
+            {
+              label: "Contact Us",              href: "#contact"},
+            {
+              label: "Help Center",              href: "#"}
+          ]
+        },
+        {
+          title: "Legal",          items: [
+            {
+              label: "Privacy Policy",              href: "#"},
+            {
+              label: "Terms of Service",              href: "#"},
+            {
+              label: "Cookie Policy",              href: "#"}
+          ]
+        }
+      ]}
+      bottomLeftText="© 2024 Nova Device. All rights reserved."
+      bottomRightText="Crafted with innovation."
+    />
+  </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -27,13 +27,17 @@ export default function LandingPage() {
       <NavbarLayoutFloatingOverlay
       navItems={[
         {
-          name: "Home",          id: "#hero"},
+          name: "Home",          id: "/"},
         {
-          name: "Contact",          id: "#contact"},
+          name: "Landing",          id: "/landing"},
+        {
+          name: "Product",          id: "/product"},
+        {
+          name: "Contact",          id: "#contact"}
       ]}
       brandName="Nova Device"
       button={{
-        text: "Get Started",        href: "#contact"}}
+        text: "Get Started",        href: "/product"}}
     />
   </div>
 
@@ -59,11 +63,11 @@ export default function LandingPage() {
           imageSrc: "http://img.b2bpic.net/free-photo/serious-afroamerican-businessman-front-view_23-2148508922.jpg",          imageAlt: "David Kim"},
         {
           name: "Jessica Lee",          handle: "@jess_innovations",          testimonial: "The Nova Device is a masterpiece of engineering. Its performance is unmatched, and the user experience is incredibly smooth. I can't imagine going back to anything else.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/business-woman-working-home_23-2148162643.jpg",          imageAlt: "Jessica Lee"},
+          imageSrc: "http://img.b2bpic.net/free-photo/business-woman-working-home_23-2148162643.jpg",          imageAlt: "Jessica Lee"}
       ]}
       buttons={[
         {
-          text: "Discover More",          href: "#contact"},
+          text: "Discover More",          href: "#contact"}
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/ai-powered-device-concept_23-2151924164.jpg"
       imageAlt="Nova Device showcasing advanced features"
@@ -78,24 +82,24 @@ export default function LandingPage() {
         {
           src: "http://img.b2bpic.net/free-photo/dreamy-woman-shirt-looking-away_197531-19648.jpg",          alt: "Dreamy woman in shirt looking away"},
         {
-          src: "http://img.b2bpic.net/free-photo/confident-african-american-businessman-brown-classic-jacket-isolated-dark-background_613910-6622.jpg",          alt: "Confident African-American businessman in a brown classic jacket."},
+          src: "http://img.b2bpic.net/free-photo/confident-african-american-businessman-brown-classic-jacket-isolated-dark-background_613910-6622.jpg",          alt: "Confident African-American businessman in a brown classic jacket."}
       ]}
       marqueeItems={[
         {
-          type: "text-icon",          text: "Innovation",          icon: Sparkles,
+          type: "text-icon",          text: "Innovation",          icon: Sparkles
         },
         {
-          type: "text-icon",          text: "Performance",          icon: Zap,
+          type: "text-icon",          text: "Performance",          icon: Zap
         },
         {
-          type: "text-icon",          text: "Security",          icon: ShieldCheck,
+          type: "text-icon",          text: "Security",          icon: ShieldCheck
         },
         {
-          type: "text-icon",          text: "Design",          icon: Diamond,
+          type: "text-icon",          text: "Design",          icon: Diamond
         },
         {
-          type: "text-icon",          text: "Connectivity",          icon: Wifi,
+          type: "text-icon",          text: "Connectivity",          icon: Wifi
-        },
+        }
       ]}
     />
   </div>
@@ -121,7 +125,7 @@ export default function LandingPage() {
           title: "Product",          items: [
             {
               label: "Pricing",              href: "#"}
-          ],
+          ]
         },
         {
           title: "Company",          items: [
@@ -130,16 +134,16 @@ export default function LandingPage() {
             {
               label: "Careers",              href: "#"},
             {
-              label: "Press",              href: "#"},
+              label: "Press",              href: "#"}
-          ],
+          ]
         },
         {
           title: "Support",          items: [
             {
               label: "Contact Us",              href: "#contact"},
             {
-              label: "Help Center",              href: "#"},
+              label: "Help Center",              href: "#"}
-          ],
+          ]
         },
         {
           title: "Legal",          items: [
@@ -148,9 +152,9 @@ export default function LandingPage() {
             {
               label: "Terms of Service",              href: "#"},
             {
-              label: "Cookie Policy",              href: "#"},
+              label: "Cookie Policy",              href: "#"}
-          ],
+          ]
-        },
+        }
       ]}
       bottomLeftText="© 2024 Nova Device. All rights reserved."
       bottomRightText="Crafted with innovation."

src/app/product/page.tsx

@@ -0,0 +1,116 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import ProductDetailCard from '@/components/ecommerce/productDetail/ProductDetailCard';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { Star } from "lucide-react";
+
+export default function ProductPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="text-stagger"
+        defaultTextAnimation="background-highlight"
+        borderRadius="pill"
+        contentWidth="smallMedium"
+        sizing="largeSmall"
+        background="noiseDiagonalGradient"
+        cardStyle="gradient-bordered"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="layered"
+        headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+  <div id="nav" data-section="nav">
+      <NavbarLayoutFloatingOverlay
+      navItems={[
+        {
+          name: "Home",          id: "/"},
+        {
+          name: "Landing",          id: "/landing"},
+        {
+          name: "Product",          id: "/product"},
+        {
+          name: "Contact",          id: "#contact"}
+      ]}
+      brandName="Nova Device"
+      button={{
+        text: "Get Started",        href: "/product"}}
+    />
+  </div>
+
+  <div id="product-detail" data-section="product-detail">
+      <ProductDetailCard
+      layout="section"
+      name="Nova Device Pro"
+      price="$999.99"
+      description="The Nova Device Pro offers cutting-edge features for ultimate productivity and entertainment. Experience the next generation of smart technology with unparalleled performance, stunning visuals, and intuitive controls. Elevate your digital lifestyle."
+      images={[
+        {
+          src: "http://img.b2bpic.net/free-photo/futuristic-mobile-phone-ai-generated_23-2151128362.jpg",          alt: "Nova Device Pro"
+        },
+        {
+          src: "http://img.b2bpic.net/free-photo/ai-generated-futuristic-tablet-display_23-2151128373.jpg",          alt: "Nova Device Pro tablet view"
+        }
+      ]}
+      showRating={true}
+      rating={4.8}
+      ratingIcon={Star}
+      buttons={[
+        {
+          text: "Buy Now",          onClick: () => alert('Added to cart!')
+        },
+        {
+          text: "Back to Landing",          href: "/landing"
+        }
+      ]}
+    />
+  </div>
+
+  <div id="footer" data-section="footer">
+      <FooterSimple
+      columns={[
+        {
+          title: "Product",          items: [
+            {
+              label: "Pricing",              href: "#"}
+          ]
+        },
+        {
+          title: "Company",          items: [
+            {
+              label: "About Us",              href: "#"},
+            {
+              label: "Careers",              href: "#"},
+            {
+              label: "Press",              href: "#"}
+          ]
+        },
+        {
+          title: "Support",          items: [
+            {
+              label: "Contact Us",              href: "#contact"},
+            {
+              label: "Help Center",              href: "#"}
+          ]
+        },
+        {
+          title: "Legal",          items: [
+            {
+              label: "Privacy Policy",              href: "#"},
+            {
+              label: "Terms of Service",              href: "#"},
+            {
+              label: "Cookie Policy",              href: "#"}
+          ]
+        }
+      ]}
+      bottomLeftText="© 2024 Nova Device. All rights reserved."
+      bottomRightText="Crafted with innovation."
+    />
+  </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}