Switch to version 5: modified src/app/page.tsx

src/app/page.tsx

@@ -15,25 +15,29 @@ import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCar
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="hover-bubble"
+        defaultButtonVariant="bounce-effect"
-        defaultTextAnimation="reveal-blur"
+        defaultTextAnimation="background-highlight"
-        borderRadius="rounded"
+        borderRadius="pill"
         contentWidth="medium"
-        sizing="medium"
+        sizing="mediumSizeLargeTitles"
-        background="none"
+        background="grid"
-        cardStyle="solid"
+        cardStyle="gradient-radial"
-        primaryButtonStyle="flat"
+        primaryButtonStyle="gradient"
-        secondaryButtonStyle="solid"
+        secondaryButtonStyle="radial-glow"
-        headingFontWeight="semibold"
+        headingFontWeight="normal"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
       <NavbarStyleFullscreen
       navItems={[
-        { name: "Shop", id: "#products" },
+        {
-        { name: "Deals", id: "#offers" },
+          name: "Shop",          id: "#products"},
-        { name: "Reviews", id: "#testimonials" },
+        {
-        { name: "Contact", id: "#contact" },
+          name: "Deals",          id: "#offers"},
+        {
+          name: "Reviews",          id: "#testimonials"},
+        {
+          name: "Contact",          id: "#contact"},
       ]}
       brandName="EASYFLEX STORES"
     />
@@ -41,18 +45,54 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroOverlayTestimonial
-      title="Smart Products. Flexible Living."
+      title="Smart Products. <span style='color: #8B4513;'>Flexible Living</span>."
       description="Discover innovative everyday essentials designed to simplify your lifestyle."
-      testimonials={[]}
+      testimonials={[
+        {
+          name: "Sarah J.",          handle: "@sarah_life",          testimonial: "The BlendPro is a life-saver for my morning commutes!",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUSwLFd74JG4BO3vRcp2rczTVE/uploaded-1778335437728-l66dqsde.jpg?_wi=1",          imageAlt: "User provided image"},
+        {
+          name: "Mark D.",          handle: "@tech_guy",          testimonial: "Love the sleek aesthetic of the FlexGlow lamp.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/blender-celery-arrangement_23-2149080584.jpg?_wi=1",          imageAlt: "User provided image"},
+        {
+          name: "Emma R.",          handle: "@lifestyle_r",          testimonial: "SmartTherm keeps my tea perfect for hours. Amazing.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/modern-photorealistic-lamp-design_23-2151039008.jpg?_wi=1",          imageAlt: "User provided image"},
+        {
+          name: "David W.",          handle: "@david_d",          testimonial: "The humidifier is quiet and very efficient.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/businessman-using-smartphone_23-2147986503.jpg?_wi=1",          imageAlt: "User provided image"},
+        {
+          name: "Lucy K.",          handle: "@lucy_tech",          testimonial: "EASYFLEX makes home office life much easier.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-modern-esential-oils-aromatherapy-diffuser-working-kitchen-while-woman-works-laptop-background_482257-30783.jpg?_wi=1",          imageAlt: "User provided image"},
+      ]}
+      buttons={[
+        {
+          text: "Shop Now",          href: "#products"},
+        {
+          text: "Explore Deals",          href: "#offers"},
+      ]}
       imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUSwLFd74JG4BO3vRcp2rczTVE/uploaded-1778335437728-l66dqsde.jpg?_wi=2"
+      imageAlt="EasyFlex Logo Branding"
+      avatars={[
+        {
+          src: "http://img.b2bpic.net/free-photo/business-woman-smiling-with-top-hat-thumbs-up_1187-1549.jpg",          alt: "Customer 1"},
+        {
+          src: "http://img.b2bpic.net/free-photo/happy-overjoyed-woman-rejoicing-her-success_74855-3513.jpg",          alt: "Customer 2"},
+        {
+          src: "http://img.b2bpic.net/free-photo/brunette-girl-giving-thumb-up_23-2147650951.jpg",          alt: "Customer 3"},
+        {
+          src: "http://img.b2bpic.net/free-photo/woman-with-coffee-cup-showing-thumb-up_23-2148055893.jpg",          alt: "Customer 4"},
+        {
+          src: "http://img.b2bpic.net/free-photo/serious-businessman-waiting-taxi-city_1262-7300.jpg",          alt: "Customer 5"},
+      ]}
     />
   </div>
 
   <div id="trust" data-section="trust">
       <SocialProofOne
       textboxLayout="default"
-      useInvertedBackground={true}
+      useInvertedBackground={false}
-      names={["Secure Checkout", "Worldwide Shipping", "24/7 Support", "Premium Quality"]}
+      names={[
+        "Secure Checkout",        "Worldwide Shipping",        "24/7 Support",        "Premium Quality"]}
       title="Trusted by Thousands"
       description="Join a global community enjoying premium, reliable products."
     />
@@ -65,8 +105,18 @@ export default function LandingPage() {
       gridVariant="four-items-2x2-equal-grid"
       useInvertedBackground={false}
       products={[
-        { id: "p1", brand: "EasyFlex", name: "Portable BlendPro Bottle", price: "$49.99", rating: 5, reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-photo/blender-celery-arrangement_23-2149080584.jpg?_wi=2" },
+        {
-        { id: "p2", brand: "EasyFlex", name: "FlexGlow LED Desk Lamp", price: "$34.99", rating: 4, reviewCount: "850", imageSrc: "http://img.b2bpic.net/free-photo/modern-photorealistic-lamp-design_23-2151039008.jpg?_wi=2" }
+          id: "p1",          brand: "EasyFlex",          name: "Portable BlendPro Bottle",          price: "$49.99",          rating: 5,
+          reviewCount: "1.2k",          imageSrc: "http://img.b2bpic.net/free-photo/blender-celery-arrangement_23-2149080584.jpg?_wi=2"},
+        {
+          id: "p2",          brand: "EasyFlex",          name: "FlexGlow LED Desk Lamp",          price: "$34.99",          rating: 4,
+          reviewCount: "850",          imageSrc: "http://img.b2bpic.net/free-photo/modern-photorealistic-lamp-design_23-2151039008.jpg?_wi=2"},
+        {
+          id: "p3",          brand: "EasyFlex",          name: "SmartTherm Mug",          price: "$39.99",          rating: 5,
+          reviewCount: "2.1k",          imageSrc: "http://img.b2bpic.net/free-photo/businessman-using-smartphone_23-2147986503.jpg?_wi=2"},
+        {
+          id: "p4",          brand: "EasyFlex",          name: "AirPulse Mini Humidifier",          price: "$29.99",          rating: 4,
+          reviewCount: "540",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-modern-esential-oils-aromatherapy-diffuser-working-kitchen-while-woman-works-laptop-background_482257-30783.jpg?_wi=2"},
       ]}
       title="Featured Essentials"
       description="Innovative tools built for your everyday lifestyle."
@@ -78,10 +128,14 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       gridVariant="uniform-all-items-equal"
-      useInvertedBackground={true}
+      useInvertedBackground={false}
       metrics={[
-        { id: "m1", value: "15%", description: "Off on all bundle buys (Buy 2+)" },
+        {
-        { id: "m2", value: "Free", description: "Worldwide shipping on $100+" }
+          id: "m1",          value: "15%",          description: "Off on all bundle buys (Buy 2+)"},
+        {
+          id: "m2",          value: "Free",          description: "Worldwide shipping on $100+"},
+        {
+          id: "m3",          value: "24h",          description: "Flash sale ending soon"},
       ]}
       title="Limited Time Offers"
       description="Unlock savings on our best-selling smart products."
@@ -93,7 +147,16 @@ export default function LandingPage() {
       useInvertedBackground={false}
       title="The EasyFlex Vision"
       description="Crafting premium, intuitive tools that seamlessly fit into your modern world."
-      metrics={[{ value: "50k+", title: "Products Shipped" }]}
+      metrics={[
+        {
+          value: "50k+",          title: "Products Shipped"},
+        {
+          value: "99%",          title: "Satisfaction Rate"},
+      ]}
+      imageSrc="http://img.b2bpic.net/free-photo/happy-young-girl-smiling-blending-healthy-detox-fresh-grapefruit-smoothie-adding-rosemary-white-wall_176420-10128.jpg"
+      imageAlt="Showcase Lifestyle"
+      mediaAnimation="slide-up"
+      metricsAnimation="slide-up"
     />
   </div>
 
@@ -102,8 +165,24 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       gridVariant="asymmetric-60-wide-40-narrow"
-      useInvertedBackground={true}
+      useInvertedBackground={false}
-      testimonials={[]}
+      testimonials={[
+        {
+          id: "r1",          name: "Alice M.",          role: "Designer",          company: "CreativeFlow",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/two-happy-male-female-business-people-showing-thumbs-up-outdoors_1262-12567.jpg"},
+        {
+          id: "r2",          name: "John D.",          role: "Engineer",          company: "BuildLab",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/businessman-with-smartphone-drink_23-2147932258.jpg"},
+        {
+          id: "r3",          name: "Samantha L.",          role: "CEO",          company: "ModernCo",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/excited-joyful-beautiful-woman-gesturing-with-hand_74855-2753.jpg"},
+        {
+          id: "r4",          name: "Robert K.",          role: "Manager",          company: "GrowthX",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/designer-working-3d-model_23-2149371895.jpg"},
+        {
+          id: "r5",          name: "Chloe B.",          role: "Writer",          company: "StoryLine",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/modern-office-confident-woman-works-creatively-professionally-exuding-innovation_1258-296528.jpg"},
+      ]}
       title="Community Love"
       description="What our customers are saying about EASYFLEX."
     />
@@ -113,21 +192,45 @@ export default function LandingPage() {
       <ContactSplitForm
       useInvertedBackground={false}
       title="Unlock Exclusive Deals"
-      description="Join the EASYFLEX community for early access to discounts and new arrivals."
+      description="Join the EASYFLEX community to receive early access to discounts and new arrivals."
       inputs={[
-        { name: "name", type: "text", placeholder: "Your Name" },
+        {
-        { name: "email", type: "email", placeholder: "Your Email" }
+          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
+        },
+        {
+          name: "email",          type: "email",          placeholder: "Your Email",          required: true,
+        },
       ]}
+      buttonText="Subscribe"
+      imageSrc="http://img.b2bpic.net/free-photo/attractive-young-woman-smiling-adding-water-blender-with-grapefruit-pieces-rosemary-healthy-diet-food-nutrition_176420-11947.jpg"
+      imageAlt="Subscription offer illustration"
     />
   </div>
 
   <div id="footer" data-section="footer">
       <FooterBaseReveal
       logoText="EASYFLEX"
-      columns={[{ title: "Company", items: [{ label: "About Us", href: "#" }] }]}
+      columns={[
+        {
+          title: "Company",          items: [
+            {
+              label: "About Us",              href: "#"},
+            {
+              label: "Contact",              href: "#contact"},
+          ],
+        },
+        {
+          title: "Legal",          items: [
+            {
+              label: "Shipping Policy",              href: "#"},
+            {
+              label: "Refund Policy",              href: "#"},
+          ],
+        },
+      ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}