Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,16 +2,14 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactText from '@/components/sections/contact/ContactText';
 import FaqSplitText from '@/components/sections/faq/FaqSplitText';
-import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
+import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
+import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
-import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
+import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
-import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import { CheckCircle, Smile, Star } from "lucide-react";
-import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
 
 export default function LandingPage() {
   return (
@@ -28,352 +26,95 @@ export default function LandingPage() {
         headingFontWeight="semibold"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
+        <div id="nav" data-section="nav">
-      <NavbarStyleApple
+          <NavbarStyleCentered
-      navItems={[
+            navItems={[
-        {
+              { name: "Habits", id: "habits" },
-          name: "Products",
+              { name: "Benefits", id: "benefits" },
-          id: "products",
+              { name: "Testimonials", id: "testimonials" },
-        },
+              { name: "FAQ", id: "faq" }
-        {
+            ]}
-          name: "Features",
+            brandName="HabitHero"
-          id: "features",
+          />
-        },
+        </div>
-        {
-          name: "Testimonials",
-          id: "testimonials",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
-      brandName="SolePath"
-    />
-  </div>
 
-  <div id="hero" data-section="hero">
+        <div id="hero" data-section="hero">
-      <HeroBillboardRotatedCarousel
+          <HeroSplitTestimonial
-      background={{
+            background={{ variant: "sparkles-gradient" }}
-        variant: "rotated-rays-animated",
+            title="Little Habits, Big Adventures!"
-      }}
+            description="Helping children build positive habits that last a lifetime, one fun step at a time."
-      title="Step Into the Future"
+            mediaAnimation="blur-reveal"
-      description="Experience unparalleled comfort and style with the latest innovation in performance footwear."
+            imageSrc="http://img.b2bpic.net/free-photo/happy-kids-playing-outdoors_1150-13611.jpg"
-      buttons={[
+            imageAlt="Happy children learning habits"
-        {
+            buttons={[{ text: "Start Learning", href: "#habits" }]}
-          text: "Shop Now",
+            testimonials={[
-          href: "#products",
+              { name: "Sarah M.", handle: "@sarahm", testimonial: "My kids actually look forward to cleaning their rooms now!", rating: 5 }
-        },
+            ]}
-      ]}
+          />
-      carouselItems={[
+        </div>
-        {
-          id: "h1",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-stylish-footwear_23-2148320247.jpg",
-          imageAlt: "Modern running shoe",
-        },
-        {
-          id: "h2",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-futuristic-sneakers_23-2151005656.jpg",
-          imageAlt: "Dynamic sneaker shot",
-        },
-        {
-          id: "h3",
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-leather-jacket-s-zip_53876-33827.jpg",
-          imageAlt: "Premium leather texture",
-        },
-        {
-          id: "h4",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-basketball-shoes_23-2150847254.jpg",
-          imageAlt: "Floating sneaker",
-        },
-        {
-          id: "h5",
-          imageSrc: "http://img.b2bpic.net/free-photo/brown-shoe-with-rocks-broccoli_52683-94824.jpg",
-          imageAlt: "Minimalist sneaker",
-        },
-        {
-          id: "h6",
-          imageSrc: "http://img.b2bpic.net/free-photo/number-written-sand_1122-2122.jpg",
-          imageAlt: "Shoe sole detail",
-        },
-      ]}
-    />
-  </div>
 
-  <div id="products" data-section="products">
+        <div id="habits" data-section="habits">
-      <ProductCardOne
+          <FeatureCardTwentyThree
-      animationType="slide-up"
+            animationType="slide-up"
-      textboxLayout="default"
+            textboxLayout="split"
-      gridVariant="four-items-2x2-equal-grid"
+            title="Our Daily Habits"
-      useInvertedBackground={false}
+            description="Discover simple, easy-to-follow routines that make life better and healthier."
-      products={[
+            useInvertedBackground={false}
-        {
+            features={[
-          id: "p1",
+              { id: "h1", title: "Brush Teeth", tags: ["Hygiene", "Morning"], imageSrc: "http://img.b2bpic.net/free-photo/child-brushing-teeth_23-2148700000.jpg" },
-          name: "Velocity Pro",
+              { id: "h2", title: "Eat Vegetables", tags: ["Health", "Lunch"], imageSrc: "http://img.b2bpic.net/free-photo/kid-eating-broccoli_23-2148700001.jpg" },
-          price: "$120",
+              { id: "h3", title: "Clean Up Toys", tags: ["Responsibility", "Daily"], imageSrc: "http://img.b2bpic.net/free-photo/kid-cleaning-toys_23-2148700002.jpg" }
-          imageSrc: "http://img.b2bpic.net/free-photo/boss-boot-service-is-thinking-about-new-design-project_613910-17427.jpg",
+            ]}
-        },
+          />
-        {
+        </div>
-          id: "p2",
-          name: "Classic Loafer",
-          price: "$180",
-          imageSrc: "http://img.b2bpic.net/free-photo/dark-blue-show-rock_52683-94821.jpg",
-        },
-        {
-          id: "p3",
-          name: "Training Edge",
-          price: "$140",
-          imageSrc: "http://img.b2bpic.net/free-photo/brown-towel-pair-shoes-with-white-ear-phone-black-background_23-2147924601.jpg",
-        },
-        {
-          id: "p4",
-          name: "Retro Court",
-          price: "$110",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-wearing-futuristic-sneakers_23-2151005708.jpg",
-        },
-        {
-          id: "p5",
-          name: "Eco-Step",
-          price: "$130",
-          imageSrc: "http://img.b2bpic.net/free-photo/cowboy-boots-stand-wooden-floor_8353-781.jpg",
-        },
-        {
-          id: "p6",
-          name: "Trail Master",
-          price: "$160",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-legs_23-2148523842.jpg",
-        },
-      ]}
-      title="Latest Arrivals"
-      description="Discover our collection of premium, handcrafted footwear designed for every lifestyle."
-    />
-  </div>
 
-  <div id="features" data-section="features">
+        <div id="metrics" data-section="metrics">
-      <FeatureCardTwelve
+          <MetricCardOne
-      textboxLayout="split"
+            animationType="depth-3d"
-      useInvertedBackground={true}
+            gridVariant="uniform-all-items-equal"
-      features={[
+            textboxLayout="split"
-        {
+            useInvertedBackground={false}
-          id: "f1",
+            title="Habit Impact"
-          label: "Comfort",
+            description="Seeing the positive changes in our community."
-          title: "Ergonomic Sole",
+            metrics={[
-          items: [
+              { id: "m1", value: "1000+", title: "Habits Mastered", description: "Completed by kids", icon: CheckCircle },
-            "Pressure mapping",
+              { id: "m2", value: "500+", title: "Daily Smiles", description: "Shared with us", icon: Smile },
-            "Supportive foam",
+              { id: "m3", value: "99%", title: "Fun Factor", description: "Reported by kids", icon: Star }
-            "Shock absorption",
+            ]}
-          ],
+          />
-        },
+        </div>
-        {
-          id: "f2",
-          label: "Material",
-          title: "Breathable Mesh",
-          items: [
-            "Climate control",
-            "Lightweight weave",
-            "Durable finish",
-          ],
-        },
-        {
-          id: "f3",
-          label: "Utility",
-          title: "All-Terrain Grip",
-          items: [
-            "Slip-resistant",
-            "Wet-weather traction",
-            "Versatile design",
-          ],
-        },
-      ]}
-      title="Unmatched Technology"
-      description="Engineered for excellence, our shoes redefine what it means to be comfortable and efficient."
-    />
-  </div>
 
-  <div id="metrics" data-section="metrics">
+        <div id="testimonials" data-section="testimonials">
-      <MetricCardEleven
+          <TestimonialCardFive
-      animationType="scale-rotate"
+            textboxLayout="default"
-      textboxLayout="default"
+            title="Happy Parents & Kids"
-      useInvertedBackground={false}
+            description="What our community says about us."
-      metrics={[
+            useInvertedBackground={false}
-        {
+            testimonials={[
-          id: "m1",
+              { id: "t1", name: "Jane Doe", date: "2023-10-01", title: "Parent", quote: "My kids actually look forward to cleaning their rooms now!", tag: "Fun", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman_23-2148972605.jpg" }
-          value: "500k+",
+            ]}
-          title: "Shoes Sold",
+          />
-          description: "Across the globe",
+        </div>
-          imageSrc: "http://img.b2bpic.net/free-photo/custom-handmade-shoes-table-busy-shoe-master-s-workplace_613910-17387.jpg",
-        },
-        {
-          id: "m2",
-          value: "98%",
-          title: "Satisfaction",
-          description: "From happy users",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-sneakers-white-background-fitness-wear-equipment-sport-fashion-sport-accessories-sport-equipment-healthy-concept-copy-space-concept-healthy-lifestyle-sport-diet-sport-equipment_1391-726.jpg",
-        },
-        {
-          id: "m3",
-          value: "15",
-          title: "Awards Won",
-          description: "For innovation",
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-model-wearing-orange-heels_23-2149704435.jpg",
-        },
-      ]}
-      title="Built for Growth"
-      description="We are committed to quality and performance at every step of the journey."
-    />
-  </div>
 
-  <div id="proof" data-section="proof">
+        <div id="faq" data-section="faq">
-      <SocialProofOne
+          <FaqSplitText
-      textboxLayout="default"
+            faqsAnimation="slide-up"
-      useInvertedBackground={true}
+            sideTitle="Frequently Asked Questions"
-      names={[
+            useInvertedBackground={false}
-        "TechCorp",
+            faqs={[
-        "SportGear",
+              { id: "q1", title: "Is it free?", content: "Yes, all habit guides are free for everyone." },
-        "UrbanLife",
+              { id: "q2", title: "Can I add my own?", content: "Yes, contact us to suggest new habits." }
-        "Innovate",
+            ]}
-        "Outdoor",
+          />
-        "TrendyCo",
+        </div>
-        "StreetCulture",
-      ]}
-      title="Trusted by Leaders"
-      description="Recognized by industry leaders for quality and sustainable practices."
-    />
-  </div>
 
-  <div id="testimonials" data-section="testimonials">
+        <div id="footer" data-section="footer">
-      <TestimonialCardSix
+          <FooterLogoEmphasis
-      animationType="slide-up"
+            logoText="HabitHero"
-      textboxLayout="default"
+            columns={[{ items: [{ label: "Home", href: "/" }, { label: "About", href: "#" }] }]}
-      useInvertedBackground={false}
+          />
-      testimonials={[
+        </div>
-        {
-          id: "t1",
-          name: "Sarah Miller",
-          handle: "@sarah_m",
-          testimonial: "The best running shoes I have ever owned. Exceptional comfort!",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg",
-        },
-        {
-          id: "t2",
-          name: "John Doe",
-          handle: "@johndoe",
-          testimonial: "Stylish enough for work, durable enough for the weekend.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-woman-outdoors_23-2149037634.jpg",
-        },
-        {
-          id: "t3",
-          name: "Emily Chen",
-          handle: "@emilyc",
-          testimonial: "Love the breathable mesh and the lightweight feel.",
-          imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-11786.jpg",
-        },
-        {
-          id: "t4",
-          name: "Mike Ross",
-          handle: "@mikeross",
-          testimonial: "High performance and great design. Highly recommended.",
-          imageSrc: "http://img.b2bpic.net/free-photo/brutal-young-man-sunglasses-hat-island-travel_1321-3839.jpg",
-        },
-        {
-          id: "t5",
-          name: "Anna Smith",
-          handle: "@annas",
-          testimonial: "Fits perfectly and looks amazing. My go-to shoe now.",
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-girl-sitting-skateboard_23-2148672431.jpg",
-        },
-      ]}
-      title="What Our Customers Say"
-      description="Real feedback from the people who wear SolePath everyday."
-    />
-  </div>
-
-  <div id="faq" data-section="faq">
-      <FaqSplitText
-      useInvertedBackground={true}
-      faqs={[
-        {
-          id: "q1",
-          title: "What is your return policy?",
-          content: "You can return any product within 30 days of purchase for a full refund.",
-        },
-        {
-          id: "q2",
-          title: "Do you ship internationally?",
-          content: "Yes, we ship to over 100 countries worldwide.",
-        },
-        {
-          id: "q3",
-          title: "How do I choose the right size?",
-          content: "Check our sizing guide for detailed measurements and fit recommendations.",
-        },
-      ]}
-      sideTitle="Questions?"
-      sideDescription="Check out our FAQ for more information."
-      faqsAnimation="slide-up"
-    />
-  </div>
-
-  <div id="contact" data-section="contact">
-      <ContactText
-      useInvertedBackground={false}
-      background={{
-        variant: "gradient-bars",
-      }}
-      text="Ready to take the next step? Get in touch with our team today."
-      buttons={[
-        {
-          text: "Contact Us",
-          href: "mailto:hello@solepath.com",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
-      columns={[
-        {
-          items: [
-            {
-              label: "Shop",
-              href: "#products",
-            },
-            {
-              label: "Technology",
-              href: "#features",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "About",
-              href: "#",
-            },
-            {
-              label: "Support",
-              href: "#",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Terms",
-              href: "#",
-            },
-            {
-              label: "Privacy",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-      logoText="SolePath"
-    />
-  </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}