Merge version_1 into main #2

Merged
bender merged 1 commits from version_1 into main 2026-04-23 11:37:18 +00:00

View File

@@ -19,351 +19,157 @@ export default function LandingPage() {
defaultButtonVariant="hover-bubble"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Accueil",
id: "hero",
},
{
name: "Services",
id: "services",
},
{
name: "À propos",
id: "about",
},
{
name: "FAQ",
id: "faq",
},
]}
brandName="Maes Débouchage"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Accueil", id: "hero" },
{ name: "Services", id: "services" },
{ name: "À propos", id: "about" },
{ name: "FAQ", id: "faq" },
]}
brandName="Maes Débouchage"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
background={{
variant: "downward-rays-static",
}}
title="Maes Débouchage : Urgences Plomberie en Belgique"
description="Expert en débouchage, curage et assainissement. Intervention rapide 24/7 partout en Belgique. Votre confort est notre priorité."
testimonials={[
{
name: "Jean Dupont",
handle: "@jean",
testimonial: "Intervention ultra rapide. Le problème de canalisation a été réglé en moins d'une heure !",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/plumber-making-time-out-gesture_1368-773.jpg?_wi=1",
imageAlt: "professional plumber tools drain cleaning",
},
{
name: "Marie L.",
handle: "@marie",
testimonial: "Très professionnel et efficace pour mon évier bouché. Je recommande vivement.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/man-drying-glass-with-kitchen-towel-by-black-faucet-drying-dishes_169016-69554.jpg?_wi=1",
imageAlt: "professional plumber tools drain cleaning",
},
{
name: "Thomas B.",
handle: "@thomas",
testimonial: "Merci pour l'intervention en pleine nuit, efficacité redoutable.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/old-weathered-tire-covered-with-moss-sand-daytime_181624-20384.jpg?_wi=1",
imageAlt: "professional plumber tools drain cleaning",
},
{
name: "Sophie P.",
handle: "@sophie",
testimonial: "Service de qualité, rien à redire sur le travail effectué.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/working-tools-things-worker-builder-electrician-top-view_169016-25063.jpg?_wi=1",
imageAlt: "professional plumber tools drain cleaning",
},
{
name: "Marc R.",
handle: "@marc",
testimonial: "Un professionnel honnête et compétent, merci pour tout.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-female-holding-hand-her-chest-while-laughing-worker-uniform-looking-merry-front-view_176474-34381.jpg?_wi=1",
imageAlt: "professional plumber tools drain cleaning",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/plumber-making-time-out-gesture_1368-773.jpg?_wi=2"
imageAlt="Plombier professionnel en action"
mediaAnimation="blur-reveal"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721526.jpg",
alt: "Plumbing professional doing his job",
},
{
src: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721528.jpg",
alt: "Plumbing professional doing his job",
},
{
src: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721531.jpg",
alt: "Plumbing professional doing his job",
},
{
src: "http://img.b2bpic.net/free-photo/side-view-woman-working-as-plumber_23-2150746391.jpg",
alt: "Side view woman working as plumber",
},
{
src: "http://img.b2bpic.net/free-photo/man-installs-heating-system-house-checks-pipes-with-wrench_169016-55837.jpg",
alt: "A man installs a heating system in a house and checks the pipes with a wrench",
},
]}
marqueeItems={[
{
type: "text",
text: "Intervention 24/7",
},
{
type: "text",
text: "Partout en Belgique",
},
{
type: "text",
text: "Devis gratuit",
},
{
type: "text",
text: "Garantie satisfaction",
},
{
type: "text",
text: "Technologie moderne",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
background={{ variant: "downward-rays-static" }}
title="Maes Débouchage : Urgences Plomberie en Belgique"
description="Expert en débouchage, curage et assainissement. Intervention rapide 24/7 partout en Belgique. Votre confort est notre priorité."
testimonials={[
{ name: "Jean Dupont", handle: "@jean", testimonial: "Intervention ultra rapide. Le problème de canalisation a été réglé en moins d'une heure !", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/plumber-making-time-out-gesture_1368-773.jpg", imageAlt: "professional plumber tools drain cleaning" },
{ name: "Marie L.", handle: "@marie", testimonial: "Très professionnel et efficace pour mon évier bouché. Je recommande vivement.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-drying-glass-with-kitchen-towel-by-black-faucet-drying-dishes_169016-69554.jpg", imageAlt: "professional plumber tools drain cleaning" },
{ name: "Thomas B.", handle: "@thomas", testimonial: "Merci pour l'intervention en pleine nuit, efficacité redoutable.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/old-weathered-tire-covered-with-moss-sand-daytime_181624-20384.jpg", imageAlt: "professional plumber tools drain cleaning" },
{ name: "Sophie P.", handle: "@sophie", testimonial: "Service de qualité, rien à redire sur le travail effectué.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/working-tools-things-worker-builder-electrician-top-view_169016-25063.jpg", imageAlt: "professional plumber tools drain cleaning" },
{ name: "Marc R.", handle: "@marc", testimonial: "Un professionnel honnête et compétent, merci pour tout.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-female-holding-hand-her-chest-while-laughing-worker-uniform-looking-merry-front-view_176474-34381.jpg", imageAlt: "professional plumber tools drain cleaning" }
]}
imageSrc="http://img.b2bpic.net/free-photo/plumber-making-time-out-gesture_1368-773.jpg"
imageAlt="Plombier professionnel en action"
mediaAnimation="blur-reveal"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721526.jpg", alt: "Plumbing professional doing his job" },
{ src: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721528.jpg", alt: "Plumbing professional doing his job" },
{ src: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721531.jpg", alt: "Plumbing professional doing his job" },
{ src: "http://img.b2bpic.net/free-photo/side-view-woman-working-as-plumber_23-2150746391.jpg", alt: "Side view woman working as plumber" },
{ src: "http://img.b2bpic.net/free-photo/man-installs-heating-system-house-checks-pipes-with-wrench_169016-55837.jpg", alt: "A man installs a heating system in a house and checks the pipes with a wrench" }
]}
marqueeItems={[
{ type: "text", text: "Intervention 24/7" },
{ type: "text", text: "Partout en Belgique" },
{ type: "text", text: "Devis gratuit" },
{ type: "text", text: "Garantie satisfaction" },
{ type: "text", text: "Technologie moderne" }
]}
/>
</div>
<div id="about" data-section="about">
<AboutMetric
useInvertedBackground={false}
title="Pourquoi nous choisir ?"
metrics={[
{
icon: Clock,
label: "Réponse d'urgence",
value: "24/7",
},
{
icon: MapPin,
label: "Couverture Belgique",
value: "100%",
},
{
icon: Wrench,
label: "Interventions réussies",
value: "5000+",
},
]}
metricsAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<AboutMetric
useInvertedBackground={false}
title="Pourquoi nous choisir ?"
metrics={[
{ icon: Clock, label: "Réponse d'urgence", value: "24/7" },
{ icon: MapPin, label: "Couverture Belgique", value: "100%" },
{ icon: Wrench, label: "Interventions réussies", value: "5000+" }
]}
metricsAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyFour
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
features={[
{
id: "1",
title: "Débouchage Haute Pression",
author: "Maes",
description: "Éliminez les bouchons les plus tenaces grâce à notre équipement spécialisé.",
tags: [
"Urgence",
"Expertise",
],
imageSrc: "http://img.b2bpic.net/free-photo/man-drying-glass-with-kitchen-towel-by-black-faucet-drying-dishes_169016-69554.jpg?_wi=2",
},
{
id: "2",
title: "Inspection par Caméra",
author: "Maes",
description: "Diagnostic précis pour localiser les obstructions dans vos conduits.",
tags: [
"Diagnostic",
"CCTV",
],
imageSrc: "http://img.b2bpic.net/free-photo/old-weathered-tire-covered-with-moss-sand-daytime_181624-20384.jpg?_wi=2",
},
{
id: "3",
title: "Entretien Assainissement",
author: "Maes",
description: "Prévention et maintenance régulière pour un système de plomberie sain.",
tags: [
"Prévention",
"Assainissement",
],
imageSrc: "http://img.b2bpic.net/free-photo/working-tools-things-worker-builder-electrician-top-view_169016-25063.jpg?_wi=2",
},
]}
title="Nos Services Experts"
description="Nous utilisons des technologies de pointe pour résoudre tous vos problèmes de plomberie et d'assainissement."
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyFour
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
features={[
{ id: "1", title: "Débouchage Haute Pression", author: "Maes", description: "Éliminez les bouchons les plus tenaces grâce à notre équipement spécialisé.", tags: ["Urgence", "Expertise"], imageSrc: "http://img.b2bpic.net/free-photo/man-drying-glass-with-kitchen-towel-by-black-faucet-drying-dishes_169016-69554.jpg" },
{ id: "2", title: "Inspection par Caméra", author: "Maes", description: "Diagnostic précis pour localiser les obstructions dans vos conduits.", tags: ["Diagnostic", "CCTV"], imageSrc: "http://img.b2bpic.net/free-photo/old-weathered-tire-covered-with-moss-sand-daytime_181624-20384.jpg" },
{ id: "3", title: "Entretien Assainissement", author: "Maes", description: "Prévention et maintenance régulière pour un système de plomberie sain.", tags: ["Prévention", "Assainissement"], imageSrc: "http://img.b2bpic.net/free-photo/working-tools-things-worker-builder-electrician-top-view_169016-25063.jpg" }
]}
title="Nos Services Experts"
description="Nous utilisons des technologies de pointe pour résoudre tous vos problèmes de plomberie et d'assainissement."
/>
</div>
<div id="team" data-section="team">
<TeamCardFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
team={[
{
id: "1",
name: "Marc Maes",
role: "Fondateur & Expert",
imageSrc: "http://img.b2bpic.net/free-photo/young-female-holding-hand-her-chest-while-laughing-worker-uniform-looking-merry-front-view_176474-34381.jpg?_wi=2",
},
{
id: "2",
name: "Luc Dupont",
role: "Technicien Senior",
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-workman-white-wall_23-2147772246.jpg",
},
{
id: "3",
name: "Sophie Martin",
role: "Technicienne Réseau",
imageSrc: "http://img.b2bpic.net/free-photo/man-fixing-kitchen-sink_53876-24827.jpg",
},
]}
title="Nos Experts à votre service"
description="Une équipe de professionnels formés, réactifs et dévoués à votre entière satisfaction."
/>
</div>
<div id="team" data-section="team">
<TeamCardFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
team={[
{ id: "1", name: "Marc Maes", role: "Fondateur & Expert", imageSrc: "http://img.b2bpic.net/free-photo/young-female-holding-hand-her-chest-while-laughing-worker-uniform-looking-merry-front-view_176474-34381.jpg" },
{ id: "2", name: "Luc Dupont", role: "Technicien Senior", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-workman-white-wall_23-2147772246.jpg" },
{ id: "3", name: "Sophie Martin", role: "Technicienne Réseau", imageSrc: "http://img.b2bpic.net/free-photo/man-fixing-kitchen-sink_53876-24827.jpg" }
]}
title="Nos Experts à votre service"
description="Une équipe de professionnels formés, réactifs et dévoués à votre entière satisfaction."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
useInvertedBackground={true}
testimonial="Une réactivité exceptionnelle. Appelé pour un bouchon total, le technicien était sur place en 30 minutes. Le professionnalisme est au rendez-vous."
rating={5}
author="Stéphanie V."
avatars={[
{
src: "http://img.b2bpic.net/free-photo/mature-woman-posing-while-touching-her-face-skin-blue-t-shirt_176474-32790.jpg",
alt: "Client 1",
},
{
src: "http://img.b2bpic.net/free-photo/joyful-colleagues-laughing-work_74855-4314.jpg",
alt: "Client 2",
},
{
src: "http://img.b2bpic.net/free-photo/man-kneeling-down-inspect-pipes-sink_259150-58249.jpg",
alt: "Client 3",
},
{
src: "http://img.b2bpic.net/free-photo/young-female-african-american-paramedic-standing-rear-ambulance-paramedics-by-ambulance-two-paramedics-taking-out-strecher-from-ambulance_657921-1477.jpg",
alt: "Client 4",
},
{
src: "http://img.b2bpic.net/free-photo/feeling-happy-astonished-something-unbelievable_1194-406808.jpg",
alt: "Client 5",
},
]}
ratingAnimation="blur-reveal"
avatarsAnimation="blur-reveal"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
useInvertedBackground={true}
testimonial="Une réactivité exceptionnelle. Appelé pour un bouchon total, le technicien était sur place en 30 minutes. Le professionnalisme est au rendez-vous."
rating={5}
author="Stéphanie V."
ratingAnimation="blur-reveal"
avatarsAnimation="blur-reveal"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/mature-woman-posing-while-touching-her-face-skin-blue-t-shirt_176474-32790.jpg", alt: "Client 1" },
{ src: "http://img.b2bpic.net/free-photo/joyful-colleagues-laughing-work_74855-4314.jpg", alt: "Client 2" },
{ src: "http://img.b2bpic.net/free-photo/man-kneeling-down-inspect-pipes-sink_259150-58249.jpg", alt: "Client 3" },
{ src: "http://img.b2bpic.net/free-photo/young-female-african-american-paramedic-standing-rear-ambulance-paramedics-by-ambulance-two-paramedics-taking-out-strecher-from-ambulance_657921-1477.jpg", alt: "Client 4" },
{ src: "http://img.b2bpic.net/free-photo/feeling-happy-astonished-something-unbelievable_1194-406808.jpg", alt: "Client 5" }
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "Intervenez-vous la nuit ?",
content: "Oui, nous proposons une assistance plomberie d'urgence 24 heures sur 24, 7 jours sur 7.",
},
{
id: "2",
title: "Quelles zones couvrez-vous ?",
content: "Nous intervenons partout en Belgique pour vos urgences de plomberie et débouchage.",
},
{
id: "3",
title: "Comment obtenir un devis ?",
content: "Contactez-nous directement par téléphone pour une estimation rapide selon votre situation.",
},
]}
sideTitle="Questions fréquentes"
sideDescription="Tout ce que vous devez savoir sur nos services d'urgence."
faqsAnimation="blur-reveal"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{ id: "1", title: "Intervenez-vous la nuit ?", content: "Oui, nous proposons une assistance plomberie d'urgence 24 heures sur 24, 7 jours sur 7." },
{ id: "2", title: "Quelles zones couvrez-vous ?", content: "Nous intervenons partout en Belgique pour vos urgences de plomberie et débouchage." },
{ id: "3", title: "Comment obtenir un devis ?", content: "Contactez-nous directement par téléphone pour une estimation rapide selon votre situation." }
]}
sideTitle="Questions fréquentes"
sideDescription="Tout ce que vous devez savoir sur nos services d'urgence."
faqsAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "glowing-orb",
}}
tag="Urgence"
title="Besoin d'un débouchage en urgence ?"
description="Nos équipes sont prêtes à intervenir immédiatement. Appelez-nous dès maintenant pour une assistance professionnelle."
buttons={[
{
text: "Appeler maintenant",
href: "tel:+32000000000",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{ variant: "glowing-orb" }}
tag="Urgence"
title="Besoin d'un débouchage en urgence ?"
description="Nos équipes sont prêtes à intervenir immédiatement. Appelez-nous dès maintenant pour une assistance professionnelle."
buttons={[
{ text: "Appeler maintenant", href: "tel:+32000000000" }
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Accueil",
href: "#hero",
},
{
label: "Services",
href: "#services",
},
],
},
{
items: [
{
label: "FAQ",
href: "#faq",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
items: [
{
label: "Mentions Légales",
href: "#",
},
{
label: "Politique de confidentialité",
href: "#",
},
],
},
]}
logoText="Maes Débouchage"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{ items: [{ label: "Accueil", href: "#hero" }, { label: "Services", href: "#services" }] },
{ items: [{ label: "FAQ", href: "#faq" }, { label: "Contact", href: "#contact" }] },
{ items: [{ label: "Mentions Légales", href: "#" }, { label: "Politique de confidentialité", href: "#" }] }
]}
logoText="Maes Débouchage"
/>
</div>
</ReactLenis>
</ThemeProvider>
);