From 78d2c240bed58780ce38a8e2952eac6c32b225f7 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 12 Apr 2026 15:39:40 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 179 ++++++++++++++++++++++-------------------------
 1 file changed, 83 insertions(+), 96 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index e9b6e24..ea416b9 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -2,14 +2,12 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
-import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
 import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
-import ContactCenter from '@/components/sections/contact/ContactCenter';
+import ProductCardThree from '@/components/sections/product/ProductCardThree';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import { Award, Settings, Sparkles } from "lucide-react";
 
 export default function LandingPage() {
@@ -27,103 +25,92 @@ export default function LandingPage() {
         headingFontWeight="bold"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleFullscreen
-      navItems={[
-        { name: "Fabrication", id: "fabrication" },
-        { name: "Boutique", id: "boutique" },
-        { name: "Commander", id: "contact" },
-        { name: "FAQ", id: "faq" },
-      ]}
-      brandName="Les Nymphes de YAYA"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+            <NavbarStyleFullscreen
+            navItems={[
+              { name: "Fabrication", id: "fabrication" },
+              { name: "Boutique", id: "boutique" },
+              { name: "Commander", id: "contact" },
+              { name: "FAQ", id: "faq" },
+            ]}
+            brandName="Les Nymphes de YAYA"
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroSplitKpi
-      background={{ variant: "gradient-bars" }}
-      title="Les Nymphes de YAYA"
-      description="Des mouches montées une par une, inspirées des éclosions des gaves et torrents pyrénéens. Plus de 200 pièces en stock, prêtes à partir sur vos rivières."
-      kpis={[
-        { value: "1.50€", label: "la mouche" },
-        { value: "200+", label: "en stock" },
-        { value: "100%", label: "fait main" },
-      ]}
-      enableKpiAnimation={true}
-      buttons={[{ text: "Commander mes mouches", href: "#contact" }]}
-      imageSrc="http://img.b2bpic.net/free-photo/mountain-landscape-zermatt-switzerland_181624-45175.jpg"
-      mediaAnimation="slide-up"
-    />
-  </div>
+        <div id="hero" data-section="hero">
+            <HeroSplitKpi
+            background={{ variant: "gradient-bars" }}
+            title="Les Nymphes de YAYA"
+            description="Des mouches montées une par une, inspirées des éclosions des gaves et torrents pyrénéens. Plus de 200 pièces en stock, prêtes à partir sur vos rivières."
+            kpis={[
+              { value: "1.50€", label: "la mouche" },
+              { value: "200+", label: "en stock" },
+              { value: "100%", label: "fait main" },
+            ]}
+            enableKpiAnimation={true}
+            buttons={[{ text: "Commander mes mouches", href: "#contact" }]}
+            imageSrc="http://img.b2bpic.net/free-photo/mountain-landscape-zermatt-switzerland_181624-45175.jpg"
+            mediaAnimation="slide-up"
+          />
+        </div>
 
-  <div id="fabrication" data-section="fabrication">
-      <FeatureBorderGlow
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      features={[
-        { icon: Sparkles, title: "Matériaux sélectionnés", description: "Perles tungstène, fils UV, poils naturels." },
-        { icon: Settings, title: "Montage artisanal", description: "Chaque mouche est montée individuellement à la main." },
-        { icon: Award, title: "Testées sur terrain", description: "Validées sur les gaves et torrents pyrénéens." },
-      ]}
-      title="Savoir-faire artisanal"
-      description="Une qualité irréprochable pour vos sessions de pêche."
-    />
-  </div>
+        <div id="fabrication" data-section="fabrication">
+            <FeatureBorderGlow
+            animationType="slide-up"
+            textboxLayout="split"
+            useInvertedBackground={false}
+            features={[
+              { icon: Sparkles, title: "Matériaux sélectionnés", description: "Perles tungstène, fils UV, poils naturels." },
+              { icon: Settings, title: "Montage artisanal", description: "Chaque mouche est montée individuellement à la main." },
+              { icon: Award, title: "Testées sur terrain", description: "Validées sur les gaves et torrents pyrénéens." },
+            ]}
+            title="Savoir-faire artisanal"
+            description="Une qualité irréprochable pour vos sessions de pêche."
+          />
+        </div>
 
-  <div id="boutique" data-section="boutique">
-      <ProductCardTwo
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
-      products={[
-        { id: "p1", brand: "Nymphe", name: "Tungstène Verte", price: "1,50 €", rating: 5, reviewCount: "12", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CFbxiqCz7uTDnHki1YbQkDd2aD/uploaded-1776007808595-8qginags.png" },
-        { id: "p2", brand: "Nymphe", name: "Bicolore Bleu/Vert", price: "1,50 €", rating: 5, reviewCount: "10", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CFbxiqCz7uTDnHki1YbQkDd2aD/uploaded-1776007808595-sj6buz5x.png" },
-        { id: "p3", brand: "Nymphe", name: "Poil Naturel", price: "1,50 €", rating: 5, reviewCount: "8", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CFbxiqCz7uTDnHki1YbQkDd2aD/uploaded-1776007808595-2ne8med3.png" },
-      ]}
-      title="La Boutique"
-      description="Toutes nos mouches sont disponibles à l'unité."
-    />
-  </div>
+        <div id="boutique" data-section="boutique">
+            <ProductCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="four-items-2x2-equal-grid"
+            useInvertedBackground={false}
+            title="Boutique Interactive"
+            description="Cliquez sur une mouche pour découvrir sa composition précise et l'ajouter à votre sélection."
+            products={[
+              { id: "p1", name: "Tungstène Verte", price: "1,50 €", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CFbxiqCz7uTDnHki1YbQkDd2aD/uploaded-1776007808595-8qginags.png", initialQuantity: 0 },
+              { id: "p2", name: "Bicolore Bleu/Vert", price: "1,50 €", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CFbxiqCz7uTDnHki1YbQkDd2aD/uploaded-1776007808595-sj6buz5x.png", initialQuantity: 0 },
+              { id: "p3", name: "Poil Naturel", price: "1,50 €", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CFbxiqCz7uTDnHki1YbQkDd2aD/uploaded-1776007808595-2ne8med3.png", initialQuantity: 0 },
+            ]}
+          />
+        </div>
 
-  <div id="faq" data-section="faq">
-      <FaqDouble
-      textboxLayout="default"
-      useInvertedBackground={false}
-      title="Questions fréquentes"
-      description="Tout savoir sur nos créations."
-      faqs={[
-        { id: "f1", title: "Quels sont les délais d'expédition ?", content: "Nous expédions vos commandes sous 48h." },
-        { id: "f4", title: "Quelles méthodes de paiement ?", content: "Virements et paiement sécurisé disponibles." },
-      ]}
-      faqsAnimation="slide-up"
-    />
-  </div>
+        <div id="contact" data-section="contact">
+            <ContactSplitForm
+              title="Passer commande"
+              description="Remplissez ce formulaire complet pour valider votre commande de mouches artisanales."
+              inputs={[
+                { name: "nom", type: "text", placeholder: "Nom complet", required: true },
+                { name: "adresse", type: "text", placeholder: "Adresse complète (rue, ville, CP)", required: true },
+                { name: "email", type: "email", placeholder: "Email de contact", required: true }
+              ]}
+              textarea={{ name: "details", placeholder: "Détails des quantités par modèle choisi", rows: 4, required: true }}
+              useInvertedBackground={true}
+              buttonText="Valider la commande"
+              onSubmit={(data) => console.log("Formulaire soumis:", data)}
+            />
+        </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCenter
-      tag="Passer commande"
-      title="Commande et Paiement"
-      description="Remplissez ce formulaire pour valider votre sélection. Un paiement sécurisé vous sera proposé par mail après confirmation de la disponibilité."
-      onSubmit={(email) => console.log("Commande initie par: ", email)}
-      buttonText="Commander maintenant"
-      termsText="En cliquant sur commander, vous acceptez d'être contacté pour finaliser les détails du paiement."
-      useInvertedBackground={true}
-      background={{ variant: "sparkles-gradient" }}
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterSimple
-      columns={[
-        { title: "Navigation", items: [{ label: "Fabrication", href: "#fabrication" }, { label: "Boutique", href: "#boutique" }, { label: "Commander", href: "#contact" }] },
-        { title: "Infos", items: [{ label: "Livraison", href: "#" }, { label: "Paiement", href: "#" }] },
-      ]}
-      bottomLeftText="© 2026 Les Nymphes de YAYA"
-      bottomRightText="Fait main avec ❤️ dans les Hautes-Pyrénées"
-    />
-  </div>
+        <div id="footer" data-section="footer">
+            <FooterSimple
+            columns={[
+              { title: "Navigation", items: [{ label: "Fabrication", href: "#fabrication" }, { label: "Boutique", href: "#boutique" }, { label: "Commander", href: "#contact" }] },
+              { title: "Infos", items: [{ label: "Livraison", href: "#" }, { label: "Paiement", href: "#" }] },
+            ]}
+            bottomLeftText="© 2026 Les Nymphes de YAYA"
+            bottomRightText="Fait main avec ❤️ dans les Hautes-Pyrénées"
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1