Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -3,295 +3,136 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactSplit from '@/components/sections/contact/ContactSplit';
-import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
+import FaqDouble from '@/components/sections/faq/FaqDouble';
-import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
+import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import FooterBase from '@/components/sections/footer/FooterBase';
-import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import HeroPersonalLinks from '@/components/sections/hero/HeroPersonalLinks';
-import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
+import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
+import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
-import { Download, Star } from "lucide-react";
+import { Download, Star, Trophy } from "lucide-react";
 
 export default function LandingPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="elastic-effect"
         defaultTextAnimation="reveal-blur"
-        borderRadius="rounded"
+        borderRadius="pill"
-        contentWidth="compact"
+        contentWidth="medium"
-        sizing="mediumLargeSizeLargeTitles"
+        sizing="mediumSizeLargeTitles"
-        background="none"
+        background="floatingGradient"
-        cardStyle="outline"
+        cardStyle="glass-depth"
-        primaryButtonStyle="gradient"
+        primaryButtonStyle="primary-glow"
         secondaryButtonStyle="glass"
-        headingFontWeight="bold"
+        headingFontWeight="extrabold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingInline
+      <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Home", id: "hero" },
-          name: "Home",
+        { name: "Features", id: "features" },
-          id: "hero",
+        { name: "Testimonials", id: "testimonials" },
-        },
+        { name: "FAQ", id: "faq" },
-        {
-          name: "Features",
-          id: "features",
-        },
-        {
-          name: "FAQ",
-          id: "faq",
-        },
       ]}
       brandName="Candy Mania"
-      button={{
+      button={{ text: "Download", href: "#contact" }}
-        text: "Download App",
-        href: "#contact",
-      }}
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboardGallery
+      <HeroPersonalLinks
-      background={{
+      background={{ variant: "sparkles-gradient" }}
-        variant: "sparkles-gradient",
+      title="Sweetest Puzzle Adventure Ever!"
-      }}
+      linkCards={[
-      title="Crush Your Way to the Top!"
+        { title: "Play Now", description: "Start your sugary journey.", button: { text: "Install", href: "#contact" } },
-      description="Experience the most addictive puzzle game on mobile. Match sweets, clear levels, and become the Candy Mania legend today!"
+        { title: "Compete", description: "Beat friend high scores.", button: { text: "Join", href: "#contact" } },
-      buttons={[
+        { title: "Rewards", description: "Unlock daily bonuses.", button: { text: "Claim", href: "#contact" } }
-        {
-          text: "Install Now",
-          href: "#contact",
-        },
       ]}
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/various-candies-multicolored-background_23-2147717420.jpg?_wi=1",
-          imageAlt: "Candy puzzle interface",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/mandala-artwork-colorful-pattern-background_58702-6967.jpg?_wi=1",
-          imageAlt: "Candy explosion",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/tilt-shift-medieval-fantasy-landscape_23-2150916624.jpg",
-          imageAlt: "Game level map",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/various-candies-multicolored-background_23-2147717420.jpg?_wi=2",
-          imageAlt: "Candy puzzle interface",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/mandala-artwork-colorful-pattern-background_58702-6967.jpg?_wi=2",
-          imageAlt: "Candy explosion",
-        },
-      ]}
-      mediaAnimation="slide-up"
     />
   </div>
 
   <div id="features" data-section="features">
-      <FeatureCardTwentyOne
+      <FeatureCardSix
-      useInvertedBackground={false}
       title="Why You'll Love Candy Mania"
-      description="Discover endless fun with thousands of challenging levels designed to keep you entertained for hours."
+      description="Endless puzzle fun with vibrant graphics and satisfying mechanics."
-      accordionItems={[
+      features={[
-        {
+        { title: "5,000+ Levels", description: "Never ending puzzle excitement." },
-          id: "f1",
+        { title: "Daily Rewards", description: "Collect sweet bonuses every day." },
-          title: "Thousands of Levels",
+        { title: "Global Leaderboard", description: "Rise to the top against friends." }
-          content: "Progress through over 5,000 uniquely crafted levels with increasing difficulty.",
-        },
-        {
-          id: "f2",
-          title: "Stunning Visuals",
-          content: "Beautiful high-definition candy art that brings the game world to life.",
-        },
-        {
-          id: "f3",
-          title: "Social Leaderboards",
-          content: "Compete with friends and players worldwide to reach the top of the leaderboards.",
-        },
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/high-angle-woman-playing-with-her-phone_23-2150455168.jpg?_wi=1"
+      textboxLayout="split"
-      imageAlt="Candy Game App interface"
+      useInvertedBackground={false}
-      mediaAnimation="slide-up"
     />
   </div>
 
   <div id="metrics" data-section="metrics">
-      <MetricCardOne
+      <MetricCardThree
       animationType="slide-up"
       textboxLayout="split"
-      gridVariant="uniform-all-items-equal"
+      useInvertedBackground={false}
-      useInvertedBackground={true}
       metrics={[
-        {
+        { id: "m1", icon: Download, title: "Installs", value: "10M+" },
-          id: "m1",
+        { id: "m2", icon: Star, title: "Rating", value: "4.9" },
-          value: "10M+",
+        { id: "m3", icon: Trophy, title: "Levels", value: "5K+" }
-          title: "Downloads",
-          description: "Global installs on Android & iOS",
-          icon: Download,
-        },
-        {
-          id: "m2",
-          value: "4.8",
-          title: "Star Rating",
-          description: "Highly rated by our players",
-          icon: Star,
-        },
-        {
-          id: "m3",
-          value: "5k+",
-          title: "Levels",
-          description: "Fresh challenges updated monthly",
-          icon: Star,
-        },
       ]}
-      title="Our Candy Community"
+      title="Trusted by Millions"
-      description="Join millions of players around the world."
+      description="Our sweet community grows every day."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardTen
+      <TestimonialCardSix
+      title="What Players Say"
+      description="Join the most enthusiastic puzzle community."
+      animationType="blur-reveal"
       textboxLayout="split"
       useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "t1", name: "Alex P.", handle: "@alex", testimonial: "The most relaxing and fun candy game!" },
-          id: "t1",
+        { id: "t2", name: "Jamie R.", handle: "@jamie", testimonial: "Graphics are stunning and level design is smart." },
-          title: "So addictive!",
+        { id: "t3", name: "Sam T.", handle: "@sam", testimonial: "Love the daily challenges, keeps it fresh!" }
-          quote: "I can't stop playing, the levels are so rewarding.",
-          name: "Sarah J.",
-          role: "Casual Gamer",
-          imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-man-happy-win-race-online-game-holds-mobile-phone-horizontally-clenches-fists-rejoices-victory-exclaims-from-joy-uses-headphones-dressed-checkered-shirt-poses-indoor_273609-56668.jpg",
-        },
-        {
-          id: "t2",
-          title: "Fun for all",
-          quote: "A perfect way to relax after work.",
-          name: "Michael K.",
-          role: "Student",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-playing-mobile-games_23-2148234803.jpg",
-        },
-        {
-          id: "t3",
-          title: "Level design is top-tier",
-          quote: "The challenges are smart and fun.",
-          name: "Emily R.",
-          role: "Developer",
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-friends-playing-videogames_23-2150571937.jpg",
-        },
-        {
-          id: "t4",
-          title: "Great graphics",
-          quote: "The candy animation is incredibly satisfying.",
-          name: "David L.",
-          role: "Designer",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-hand-holding-smart-phone-blank-screen-copy-space-hand-holding-smartphone-isolated-white-background_1150-2212.jpg",
-        },
-        {
-          id: "t5",
-          title: "Love the events",
-          quote: "Daily challenges keep me coming back.",
-          name: "Jessica B.",
-          role: "Teacher",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-using-her-smartphone-home-couch-by-holding-from-pop-socket_23-2150168424.jpg",
-        },
       ]}
-      title="Player Stories"
-      description="See why millions love playing Candy Mania."
     />
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqSplitMedia
+      <FaqDouble
-      textboxLayout="split"
-      useInvertedBackground={true}
-      faqs={[
-        {
-          id: "q1",
-          title: "Is the game free?",
-          content: "Yes, Candy Mania is free to download and play, with optional in-app purchases.",
-        },
-        {
-          id: "q2",
-          title: "Can I play offline?",
-          content: "Yes, you can enjoy most levels offline without an internet connection.",
-        },
-        {
-          id: "q3",
-          title: "How do I save progress?",
-          content: "Connect your social account to save and sync progress across devices.",
-        },
-      ]}
       title="Frequently Asked Questions"
-      description="Have questions? We have answers."
+      description="Answers to your candy-crushing questions."
-      faqsAnimation="blur-reveal"
+      faqsAnimation="slide-up"
-      imageSrc="http://img.b2bpic.net/free-photo/high-angle-woman-playing-with-her-phone_23-2150455168.jpg?_wi=2"
+      textboxLayout="split"
-      mediaAnimation="blur-reveal"
+      useInvertedBackground={false}
+      faqs={[
+        { id: "q1", title: "Is it free to play?", content: "Absolutely! Enjoy for free." },
+        { id: "q2", title: "Can I play offline?", content: "Yes, levels are playable without internet." },
+        { id: "q3", title: "Is progress synced?", content: "Login with socials to sync across devices." }
+      ]}
     />
   </div>
 
   <div id="contact" data-section="contact">
       <ContactSplit
+      tag="Download Now"
+      title="Start Your Adventure"
+      description="Get notified of new levels and candy events."
+      buttonText="Get App"
+      background={{ variant: "sparkles-gradient" }}
       useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
-      tag="Download Today"
-      title="Get Ready to Play"
-      description="Sign up for updates, news, and exclusive candy rewards."
-      imageSrc="http://img.b2bpic.net/free-photo/different-colorful-sugar-candies-top-view_114579-7944.jpg"
-      inputPlaceholder="Email address"
-      buttonText="Notify Me"
-      mediaAnimation="slide-up"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
+      <FooterBase
-      columns={[
-        {
-          items: [
-            {
-              label: "About",
-              href: "#",
-            },
-            {
-              label: "Community",
-              href: "#",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Support",
-              href: "#",
-            },
-            {
-              label: "Contact",
-              href: "#",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Privacy",
-              href: "#",
-            },
-            {
-              label: "Terms",
-              href: "#",
-            },
-          ],
-        },
-      ]}
       logoText="Candy Mania"
+      columns={[
+        { title: "Product", items: [{ label: "Game", href: "#" }] },
+        { title: "Company", items: [{ label: "About", href: "#" }] },
+        { title: "Legal", items: [{ label: "Privacy", href: "#" }] }
+      ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}