Merge version_1 into main #1
337
src/app/page.tsx
337
src/app/page.tsx
@@ -18,232 +18,137 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
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">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Accueil",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Réalisations",
|
||||
id: "metrics",
|
||||
},
|
||||
{
|
||||
name: "Avis",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="YNS TP"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Accueil", id: "hero" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Réalisations", id: "metrics" },
|
||||
{ name: "Avis", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="YNS TP"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Donnez vie à vos extérieurs avec un expert local"
|
||||
description="YNS TP : Aménagement paysager, terrassement et entretien pour particuliers et professionnels à Mulhouse. Plus de 18 ans d'expérience."
|
||||
buttons={[
|
||||
{
|
||||
text: "Demander mon devis gratuit",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Appelez-nous",
|
||||
href: "tel:0389000000",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-gardener-working-garden_23-2148165264.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Donnez vie à vos extérieurs avec un expert local"
|
||||
description="YNS TP : Aménagement paysager, terrassement et entretien pour particuliers et professionnels à Mulhouse. Plus de 18 ans d'expérience."
|
||||
buttons={[
|
||||
{ text: "Demander mon devis gratuit", href: "#contact" },
|
||||
{ text: "Appelez-nous", href: "tel:0389000000" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-gardener-working-garden_23-2148165264.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Votre projet paysager entre de bonnes mains"
|
||||
description="Chez YNS TP, nous allions savoir-faire technique et créativité. De la conception de votre jardin à l'entretien courant, nous assurons des finitions de qualité supérieure pour valoriser votre patrimoine."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Expertise Locale",
|
||||
description: "18 ans au service des mulhousiens.",
|
||||
},
|
||||
{
|
||||
title: "Devis Rapide",
|
||||
description: "Réponse sous 24h-48h.",
|
||||
},
|
||||
{
|
||||
title: "Garantie Qualité",
|
||||
description: "Un travail soigné et durable.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/businesswoman-green-grass_1098-1751.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Votre projet paysager entre de bonnes mains"
|
||||
description="Chez YNS TP, nous allions savoir-faire technique et créativité. De la conception de votre jardin à l'entretien courant, nous assurons des finitions de qualité supérieure pour valoriser votre patrimoine."
|
||||
bulletPoints={[
|
||||
{ title: "Expertise Locale", description: "18 ans au service des mulhousiens." },
|
||||
{ title: "Devis Rapide", description: "Réponse sous 24h-48h." },
|
||||
{ title: "Garantie Qualité", description: "Un travail soigné et durable." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/businesswoman-green-grass_1098-1751.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Aménagement Paysager",
|
||||
description: "Création d'espaces verts, massifs et gazon.",
|
||||
tag: "Jardin",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/brown-wooden-bridge_417767-270.jpg",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Terrassement & Maçonnerie",
|
||||
description: "Allées, pavage et murs de soutènement.",
|
||||
tag: "Travaux",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-construction-work-site_1398-2992.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Entretien de Jardin",
|
||||
description: "Tonte, taille et débroussaillage régulier.",
|
||||
tag: "Entretien",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-professional-gardener-holding-trimmer-working-yard_342744-541.jpg",
|
||||
},
|
||||
]}
|
||||
title="Nos services experts"
|
||||
description="Nous intervenons sur tous types de projets extérieurs avec professionnalisme."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "Aménagement Paysager", description: "Création d'espaces verts, massifs et gazon.", tag: "Jardin", imageSrc: "http://img.b2bpic.net/free-photo/brown-wooden-bridge_417767-270.jpg" },
|
||||
{ id: "f2", title: "Terrassement & Maçonnerie", description: "Allées, pavage et murs de soutènement.", tag: "Travaux", imageSrc: "http://img.b2bpic.net/free-photo/view-construction-work-site_1398-2992.jpg" },
|
||||
{ id: "f3", title: "Entretien de Jardin", description: "Tonte, taille et débroussaillage régulier.", tag: "Entretien", imageSrc: "http://img.b2bpic.net/free-photo/portrait-professional-gardener-holding-trimmer-working-yard_342744-541.jpg" },
|
||||
]}
|
||||
title="Nos services experts"
|
||||
description="Nous intervenons sur tous types de projets extérieurs avec professionnalisme."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "18+",
|
||||
description: "Ans d'expérience",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "4.6/5",
|
||||
description: "Note moyenne Google",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "300+",
|
||||
description: "Projets livrés",
|
||||
},
|
||||
]}
|
||||
title="En chiffres"
|
||||
description="Une expérience terrain confirmée par nos clients."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "18+", description: "Ans d'expérience" },
|
||||
{ id: "m2", value: "4.6/5", description: "Note moyenne Google" },
|
||||
{ id: "m3", value: "300+", description: "Projets livrés" },
|
||||
]}
|
||||
title="En chiffres"
|
||||
description="Une expérience terrain confirmée par nos clients."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "M. Weber",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-celebrating-engagement_23-2149401308.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mme. Fischer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cropped-shot-interracial-woman-man-cooperate-project_273609-44228.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "M. Schmidt",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-couple-decorating-home_23-2150633271.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Mme. Meyer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-albino-woman-with-coffee-cup_23-2150170388.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "M. Klein",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/parents-daughter-spending-time-together-while-wearing-linen-clothing_23-2150659515.jpg",
|
||||
},
|
||||
]}
|
||||
cardTitle="Ce que nos clients disent"
|
||||
cardTag="Avis"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "M. Weber", imageSrc: "http://img.b2bpic.net/free-photo/young-couple-celebrating-engagement_23-2149401308.jpg" },
|
||||
{ id: "t2", name: "Mme. Fischer", imageSrc: "http://img.b2bpic.net/free-photo/cropped-shot-interracial-woman-man-cooperate-project_273609-44228.jpg" },
|
||||
{ id: "t3", name: "M. Schmidt", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-couple-decorating-home_23-2150633271.jpg" },
|
||||
{ id: "t4", name: "Mme. Meyer", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-albino-woman-with-coffee-cup_23-2150170388.jpg" },
|
||||
{ id: "t5", name: "M. Klein", imageSrc: "http://img.b2bpic.net/free-photo/parents-daughter-spending-time-together-while-wearing-linen-clothing_23-2150659515.jpg" },
|
||||
]}
|
||||
cardTitle="Ce que nos clients disent"
|
||||
cardTag="Avis"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Zone d'intervention ?",
|
||||
content: "Nous intervenons dans un rayon de 30km autour de Mulhouse.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Devis gratuit ?",
|
||||
content: "Oui, tous nos devis sont gratuits et sans engagement.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Délais ?",
|
||||
content: "Nous nous efforçons d'intervenir rapidement selon nos disponibilités.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Questions fréquentes"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Zone d'intervention ?", content: "Nous intervenons dans un rayon de 30km autour de Mulhouse." },
|
||||
{ id: "q2", title: "Devis gratuit ?", content: "Oui, tous nos devis sont gratuits et sans engagement." },
|
||||
{ id: "q3", title: "Délais ?", content: "Nous nous efforçons d'intervenir rapidement selon nos disponibilités." },
|
||||
]}
|
||||
sideTitle="Questions fréquentes"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Contact"
|
||||
title="Prêt à transformer votre extérieur ?"
|
||||
description="Appelez-nous ou envoyez-nous une demande pour obtenir votre devis personnalisé sous 24h."
|
||||
buttons={[
|
||||
{
|
||||
text: "03 89 00 00 00",
|
||||
href: "tel:0389000000",
|
||||
},
|
||||
{
|
||||
text: "Formulaire de devis",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact"
|
||||
title="Prêt à transformer votre extérieur ?"
|
||||
description="Appelez-nous ou envoyez-nous une demande pour obtenir votre devis personnalisé sous 24h."
|
||||
buttons={[
|
||||
{ text: "03 89 00 00 00", href: "tel:0389000000" },
|
||||
{ text: "Formulaire de devis", href: "#" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="YNS TP"
|
||||
copyrightText="© 2025 YNS TP Mulhouse. Tous droits réservés."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="YNS TP"
|
||||
copyrightText="© 2025 YNS TP Mulhouse. Tous droits réservés."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user