Merge version_1 into main #5
221
src/app/page.tsx
221
src/app/page.tsx
@@ -1,7 +1,6 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
@@ -12,147 +11,97 @@ import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
|
||||
export default function LandingPage() {
|
||||
const navItems = [{ name: "Home", id: "/" }];
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="mediumLargeSizeMediumTitles"
|
||||
background="fluid"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "À propos", id: "about" },
|
||||
{ name: "Avis", id: "testimonials" },
|
||||
{ name: "Zone", id: "zone" }
|
||||
]}
|
||||
brandName="Plomberie André Auger"
|
||||
button={{ text: "(514) 993-4043", href: "tel:+15149934043" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="La plomberie de confiance, depuis 1995"
|
||||
description="Expertise, rapidité et transparence pour tous vos besoins en plomberie résidentielle et commerciale dans le Grand Montréal et les Laurentides. Urgences disponibles 24h/24."
|
||||
tag="Disponible 24h/24 · 7j/7"
|
||||
buttons={[
|
||||
{ text: "Appeler maintenant", href: "tel:+15149934043" },
|
||||
{ text: "Voir les services", href: "#services" }
|
||||
]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138424.jpg", imageAlt: "Plomberie de luxe" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138424.jpg", imageAlt: "Service 24/7" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="87 avis Google (4.9/5)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="trust-band" data-section="trust-band">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={["Disponible 24/7", "Équipe Certifiée", "Travail Garanti", "Grand Montréal & Laurentides", "Membre CMMTQ"]}
|
||||
title="Engagement de Qualité"
|
||||
description="Un service certifié et garanti."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "01", title: "Urgences 24h/24", tags: ["Rapide"], imageSrc: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138424.jpg", imageAlt: "luxury bathroom interior gold plumbing fixtures" },
|
||||
{ id: "02", title: "Chauffe-eau", tags: ["Installation"], imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg", imageAlt: "happy client portrait residential" },
|
||||
{ id: "03", title: "Débouchage", tags: ["Expert"], imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-home-office_329181-20664.jpg", imageAlt: "woman smiling residential client portrait" },
|
||||
{ id: "04", title: "Installations sanitaires", tags: ["Précis"], imageSrc: "http://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg", imageAlt: "senior professional man portrait" },
|
||||
{ id: "05", title: "Pompe de puisard", tags: ["Prévention"], imageSrc: "http://img.b2bpic.net/free-photo/digital-tablet-with-layout-worker-clothes-top-view_169016-24423.jpg", imageAlt: "montreal map stylized" },
|
||||
{ id: "06", title: "Rénovation & construction", tags: ["Projet"], imageSrc: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138424.jpg", imageAlt: "luxury bathroom interior gold plumbing fixtures" }
|
||||
]}
|
||||
title="Nos Services"
|
||||
description="Solutions complètes pour vos installations et réparations."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="10 ans d'expérience"
|
||||
description={[
|
||||
"Fondée avec une mission simple : offrir une plomberie honnête et durable.", "Nous traitons chaque client avec respect et chaque installation avec rigueur.", "Service rapide 24h/24 pour votre tranquillité d'esprit."
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Danny Myint", handle: "Client depuis 10 ans", testimonial: "Un travail exceptionnel à chaque fois. Très fiable.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg" },
|
||||
{ id: "2", name: "Catherine Morin", handle: "Client depuis 16 ans", testimonial: "André est toujours là quand on a besoin d'urgence. Parfait.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-home-office_329181-20664.jpg" },
|
||||
{ id: "3", name: "Marc L.", handle: "Client satisfait", testimonial: "Service rapide, honnête et très professionnel.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg" },
|
||||
{ id: "4", name: "Sophie B.", handle: "Client satisfait", testimonial: "Excellent service, je recommande fortement.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg" },
|
||||
{ id: "5", name: "Jean P.", handle: "Client satisfait", testimonial: "La référence en plomberie dans la région.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-home-office_329181-20664.jpg" }
|
||||
]}
|
||||
showRating={true}
|
||||
title="Ce que disent nos clients"
|
||||
description="87 avis Google, note moyenne 4.9/5"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="zone" data-section="zone">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "z1", title: "Zones principales", content: "Saint-Colomban, Saint-Jérôme, Blainville, Mirabel, Lachute, Deux-Montagnes, Sainte-Thérèse, Mont-Tremblant, Saint-Sauveur, Grand Montréal" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/digital-tablet-with-layout-worker-clothes-top-view_169016-24423.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
title="Zone desservie"
|
||||
description="Services disponibles dans les Laurentides et le Grand Montréal."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="final-cta" data-section="final-cta">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Disponible 24h/24 · 7j/7"
|
||||
title="(514) 993-4043"
|
||||
description="Urgences bienvenues · Service de confiance depuis 1995"
|
||||
buttons={[
|
||||
{ text: "Appeler maintenant", href: "tel:+15149934043" },
|
||||
{ text: "Site web", href: "https://plomberieandreauger.ca" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Plomberie André Auger"
|
||||
leftLink={{ text: "100 Rue de la Naïade, Saint-Colomban, QC J5K 1P7", href: "#" }}
|
||||
rightLink={{ text: "© 2024 Plomberie André Auger", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline navItems={navItems} />
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
title="Plomberie André Auger"
|
||||
description="Expert en plomberie résidentielle et commerciale dans les Laurentides et le Grand Montréal."
|
||||
background={{ variant: 'radial-gradient' }}
|
||||
tag="Service 24/7"
|
||||
rating={5}
|
||||
ratingText="4.9/5 satisfaction"
|
||||
mediaItems={[{ imageSrc: 'https://images.unsplash.com/photo-1581783330335-2633004d49a3?q=80&w=800' }, { imageSrc: 'https://images.unsplash.com/photo-1525547719571-a2d4ac8945e2?q=80&w=800' }]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="trust-band" data-section="trust-band">
|
||||
<SocialProofOne
|
||||
names={['Laurentides', 'Montréal', 'Grand Montréal', 'Plomberie Experts']}
|
||||
title="Services de confiance"
|
||||
textboxLayout="default"
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyThree
|
||||
title="Nos Services"
|
||||
description="Expertise complète pour vos besoins en plomberie."
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
features={[
|
||||
{ id: '1', title: 'Plomberie Résidentielle', tags: ['Urgence'] },
|
||||
{ id: '2', title: 'Plomberie Commerciale', tags: ['Installation'] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
title="Plus de 10 ans d'expérience"
|
||||
description={["André Auger et son équipe offrent des services fiables et professionnels 24/7."]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
title="Ce que disent nos clients"
|
||||
description="Des années de service de qualité."
|
||||
showRating={true}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
testimonials={[
|
||||
{ id: 't1', name: 'Jean D.', handle: '@client', testimonial: 'Service exceptionnel et rapide !', rating: 5 }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="zone" data-section="zone">
|
||||
<FaqSplitMedia
|
||||
title="Questions fréquentes"
|
||||
faqs={[{ id: 'f1', title: 'Quelles zones desservez-vous?', content: 'Laurentides et Grand Montréal.' }]}
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
/>
|
||||
</div>
|
||||
<div id="final-cta" data-section="final-cta">
|
||||
<ContactCTA
|
||||
tag="Urgence"
|
||||
title="Besoin d'aide immédiate?"
|
||||
description="Contactez-nous pour une intervention rapide 24h/24, 7j/7."
|
||||
buttons={[{ text: "Appeler maintenant" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Plomberie André Auger"
|
||||
leftLink={{ text: "Accueil", href: "/" }}
|
||||
rightLink={{ text: "Contact", href: "#final-cta" }}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user