bender/8c440aa8-2d6a-4ef5-9301-339087473d7c
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bob AI: Update hero section with HeroBillboardScroll and content

Browse Source
This commit is contained in:
kudinDmitriyUp
2026-06-15 22:49:15 +00:00
parent c94fdfe6a9
commit 765ed61158
9 changed files with 221 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
src/pages/HomePage.tsx
View File

@@ -1,135 +1,36 @@
import ContactCta from '@/components/sections/contact/ContactCta';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
import FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
import HeroBillboardBrand from '@/components/sections/hero/HeroBillboardBrand';
import MetricsIconCards from '@/components/sections/metrics/MetricsIconCards';
import PricingMediaCards from '@/components/sections/pricing/PricingMediaCards';
import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
// AUTO-GENERATED shell by per-section-migrate.
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
// files directly. Non-block content (wrappers, non-inlinable sections) is
// preserved inline; extracted section blocks become <XSection/> refs.
export default function HomePage() {
import React from 'react';
import HeroSection from './HomePage/sections/Hero';
import ProblemeSection from './HomePage/sections/Probleme';
import OffreSection from './HomePage/sections/Offre';
import ComparatifSection from './HomePage/sections/Comparatif';
import PortfolioSection from './HomePage/sections/Portfolio';
import TemoignagesSection from './HomePage/sections/Temoignages';
import FaqSection from './HomePage/sections/Faq';
import ContactSection from './HomePage/sections/Contact';
export default function HomePage(): React.JSX.Element {
return (
<>
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroBillboardBrand
brand="Votre site professionnel clé en main à 200 € tout inclus"
description="Enfin une présence en ligne impeccable pour votre PME, commerce ou cabinet. Livraison express en 48h. Satisfaction garantie ou remboursée 30 jours."
primaryButton={{ text: "Je veux mon site à 200 €", href: "#contact" }}
secondaryButton={{ text: "Voir nos réalisations", href: "#portfolio" }}
imageSrc="https://images.pexels.com/photos/34984882/pexels-photo-34984882.jpeg?auto=compress&cs=tinysrgb&h=650&w=940&id=34984882"
/>
</SectionErrorBoundary>
</div>
<>
<HeroSection />
<div id="probleme" data-section="probleme">
<SectionErrorBoundary name="probleme">
<FeaturesMediaCards
tag="Pourquoi passer à l'action ?"
title="Ne laissez plus vos clients filer chez la concurrence"
description="À l'ère du tout numérique, une absence de site professionnel vous coûte cher chaque jour."
items={[
{ title: "Perte de nouveaux clients", description: "Vos prospects cherchent sur Google, vous ne leur apparaissez pas. Ils vont chez vos concurrents.", imageSrc: "http://img.b2bpic.net/free-photo/conches-with-chocolate-balls_1220-214.jpg" },
{ title: "Devis perdus", description: "Un site est une vitrine qui travaille 24h/24 pour capturer des demandes de devis automatiquement.", imageSrc: "http://img.b2bpic.net/free-photo/household-problem-woman-pointing-broken-tap-with-jet-water-man-with-suitcase-tools_259150-58295.jpg" },
{ title: "Image dégradée", description: "Dans l'esprit du client, pas de site = pas de confiance. Ne soyez plus perçu comme un amateur.", imageSrc: "http://img.b2bpic.net/free-photo/customer-standing-front-mirror-barbershop_23-2148181953.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<ProblemeSection />
<div id="offre" data-section="offre">
<SectionErrorBoundary name="offre">
<PricingMediaCards
tag="L'offre Siteflash"
title="Votre présence en ligne pour 200 €"
description="Aucun abonnement caché. Vous êtes propriétaire à 100% de votre site."
plans={[
{ tag: "Forfait Unique", price: "200 €", period: "tout inclus", features: ["Design responsive pro", "Formulaire de contact", "Intégration Google Maps", "SEO de base pour Google", "Propriété totale des fichiers", "Livraison sous 48h"], primaryButton: { text: "Je commande maintenant", href: "#contact" }, imageSrc: "http://img.b2bpic.net/free-photo/blurred-background-receptionist-working_1203-994.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<OffreSection />
<div id="comparatif" data-section="comparatif">
<SectionErrorBoundary name="comparatif">
<MetricsIconCards
tag="Comparatif"
title="Pourquoi payer plus cher pour moins bien ?"
description="Chez Siteflash, nous misons sur l'efficacité."
metrics={[
{ icon: "CheckCircle", title: "Délai de livraison", value: "48h" },
{ icon: "CheckCircle", title: "Coût annuel", value: "0 €" },
{ icon: "CheckCircle", title: "Propriété du site", value: "100%" }
]}
/>
</SectionErrorBoundary>
</div>
<ComparatifSection />
<div id="portfolio" data-section="portfolio">
<SectionErrorBoundary name="portfolio">
<FeaturesImageBento
tag="Nos réalisations"
title="Des sites qui convertissent"
description="Découvrez nos dernières créations pour divers secteurs."
items={[
{ title: "Restaurant La Table", description: "Restauration • Réservations x3", imageSrc: "http://img.b2bpic.net/free-photo/halloween-composition-with-space-right_23-2147675382.jpg" },
{ title: "BTP Construction", description: "Artisanat • Demandes de devis accrues", imageSrc: "http://img.b2bpic.net/free-photo/happy-contractors-pointing-white-laptop-display-showing-isolated-blank-screen-wireless-pc-team-builders-holding-computer-with-empty-copyspace-template-posing-studio_482257-60531.jpg" },
{ title: "Beauté & Co", description: "Coiffure • Prise de RDV en ligne", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-women-posing-together-studio_23-2149643152.jpg" },
{ title: "Cabinet dentaire", description: "Santé • Visibilité locale locale", imageSrc: "http://img.b2bpic.net/free-photo/hospital-reception-desk-with-computer-making-healthcare-appointments-patients-with-disease-registration-work-with-medical-checkup-reports-papers-forms-facility-lobby_482257-50665.jpg" },
{ title: "Fleuriste du coin", description: "Commerce • Vente locale", imageSrc: "http://img.b2bpic.net/free-photo/decorative-dreamy-arrangement-with-dried-flowers_23-2151363326.jpg" },
{ title: "Coach Vitalité", description: "Sport • Coaching privé", imageSrc: "http://img.b2bpic.net/free-photo/fitness-health-physical-strength-training-workout-concept_53876-133837.jpg" },
{ title: "Auto École Express", description: "Services • Inscriptions", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-pieces-bread-basket-shop_181624-32196.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<PortfolioSection />
<div id="temoignages" data-section="temoignages">
<SectionErrorBoundary name="temoignages">
<TestimonialColumnMarqueeCards
tag="Ils nous ont fait confiance"
title="Des clients conquis par notre rapidité"
description="Découvrez ce que disent nos clients de notre service express."
testimonials={[
{ name: "Marie L.", role: "Boulangère, Lyon", quote: "Site livré en 2 jours, design sublime, j'ai déjà 30% de nouveaux clients.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-having-breakfast_23-2148597005.jpg" },
{ name: "Paul D.", role: "Plombier, Bordeaux", quote: "Enfin une vitrine pro sans payer des milliers d'euros. Très efficace.", imageSrc: "http://img.b2bpic.net/free-photo/builder-handyman-with-construction-tools-house-house-renovation-concept_169016-5873.jpg" },
{ name: "Julie K.", role: "Coiffeuse, Nantes", quote: "La prise de RDV est devenue automatique. Un gain de temps précieux.", imageSrc: "http://img.b2bpic.net/free-photo/stylish-beauty-women-elegent-enjoy-concept_53876-148023.jpg" },
{ name: "Marc T.", role: "Restaurateur, Paris", quote: "Le meilleur investissement pour mon restaurant cette année.", imageSrc: "http://img.b2bpic.net/free-photo/asian-medical-doctor-take-care-explain-senior-elderly-woman-female-patient-wheelchair-with-tablet-looking-camera_554837-54.jpg" },
{ name: "Sophie P.", role: "Coach, Marseille", quote: "Simple, efficace, rapide. Exactement ce dont j'avais besoin.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-accident-treadmill_23-2148419833.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<TemoignagesSection />
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqSplitMedia
tag="Questions fréquentes"
title="Tout savoir sur Siteflash"
description="Réponses à toutes vos interrogations sur notre offre."
items={[
{ question: "Quel est le prix final ?", answer: "200 €, ni plus, ni moins." },
{ question: "Comment gérer le site ?", answer: "Nous vous livrons un site prêt à l'emploi, autonome." },
{ question: "Pourquoi vous ?", answer: "La qualité au juste prix, sans fioritures." },
{ question: "Résultat insatisfaisant ?", answer: "Satisfait ou remboursé pendant 30 jours." },
{ question: "Livraison en 2 jours ?", answer: "Oui, c'est notre spécialité." }
]}
imageSrc="http://img.b2bpic.net/free-photo/modern-office-workspace-equipped-digital-design-photo-editing_482257-126934.jpg"
/>
</SectionErrorBoundary>
</div>
<FaqSection />
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Action"
text="Prêt à booster votre business pour 200 € ?"
primaryButton={{ text: "Je veux mon site", href: "#" }}
secondaryButton={{ text: "Contactez-nous", href: "mailto:hello@siteflash.fr" }}
/>
</SectionErrorBoundary>
</div>
<ContactSection />
</>
);
}

25
src/pages/HomePage/sections/Comparatif.tsx Normal file
View File

@@ -0,0 +1,25 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "comparatif" section.
import React from 'react';
import MetricsIconCards from '@/components/sections/metrics/MetricsIconCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ComparatifSection(): React.JSX.Element {
return (
<div id="comparatif" data-section="comparatif">
<SectionErrorBoundary name="comparatif">
<MetricsIconCards
tag="Comparatif"
title="Pourquoi payer plus cher pour moins bien ?"
description="Chez Siteflash, nous misons sur l'efficacité."
metrics={[
{ icon: "CheckCircle", title: "Délai de livraison", value: "48h" },
{ icon: "CheckCircle", title: "Coût annuel", value: "0 €" },
{ icon: "CheckCircle", title: "Propriété du site", value: "100%" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

21
src/pages/HomePage/sections/Contact.tsx Normal file
View File

@@ -0,0 +1,21 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "contact" section.
import React from 'react';
import ContactCta from '@/components/sections/contact/ContactCta';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ContactSection(): React.JSX.Element {
return (
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Action"
text="Prêt à booster votre business pour 200 € ?"
primaryButton={{ text: "Je veux mon site", href: "#" }}
secondaryButton={{ text: "Contactez-nous", href: "mailto:hello@siteflash.fr" }}
/>
</SectionErrorBoundary>
</div>
);
}

28
src/pages/HomePage/sections/Faq.tsx Normal file
View File

@@ -0,0 +1,28 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "faq" section.
import React from 'react';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function FaqSection(): React.JSX.Element {
return (
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqSplitMedia
tag="Questions fréquentes"
title="Tout savoir sur Siteflash"
description="Réponses à toutes vos interrogations sur notre offre."
items={[
{ question: "Quel est le prix final ?", answer: "200 €, ni plus, ni moins." },
{ question: "Comment gérer le site ?", answer: "Nous vous livrons un site prêt à l'emploi, autonome." },
{ question: "Pourquoi vous ?", answer: "La qualité au juste prix, sans fioritures." },
{ question: "Résultat insatisfaisant ?", answer: "Satisfait ou remboursé pendant 30 jours." },
{ question: "Livraison en 2 jours ?", answer: "Oui, c'est notre spécialité." }
]}
imageSrc="http://img.b2bpic.net/free-photo/modern-office-workspace-equipped-digital-design-photo-editing_482257-126934.jpg"
/>
</SectionErrorBoundary>
</div>
);
}

19
src/pages/HomePage/sections/Hero.tsx Normal file
View File

@@ -0,0 +1,19 @@
// Created by add_section_from_catalog (HeroBillboardScroll).
import React from 'react';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
export default function HeroSection(): React.JSX.Element {
return (
<div data-webild-section="hero" id="hero">
<HeroBillboardScroll
tag="500+ sites livrés • ⭐ 4,9/5"
title="Votre site professionnel clé en main à 200 € tout inclus"
description="Enfin une présence en ligne impeccable pour votre PME, commerce ou cabinet. Livraison express en 48h. Satisfaction garantie ou remboursée 30 jours. Aucun abonnement caché."
primaryButton={{"href":"#contact","text":"Je veux mon site à 200 €"}}
secondaryButton={{"href":"#portfolio","text":"Voir nos réalisations"}}
imageSrc="https://images.unsplash.com/photo-1460925895917-afdab827c52f?auto=format&fit=crop&q=80&w=2426&ixlib=rb-4.0.3"
/>
</div>
);
}

23
src/pages/HomePage/sections/Offre.tsx Normal file
View File

@@ -0,0 +1,23 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "offre" section.
import React from 'react';
import PricingMediaCards from '@/components/sections/pricing/PricingMediaCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function OffreSection(): React.JSX.Element {
return (
<div id="offre" data-section="offre">
<SectionErrorBoundary name="offre">
<PricingMediaCards
tag="L'offre Siteflash"
title="Votre présence en ligne pour 200 €"
description="Aucun abonnement caché. Vous êtes propriétaire à 100% de votre site."
plans={[
{ tag: "Forfait Unique", price: "200 €", period: "tout inclus", features: ["Design responsive pro", "Formulaire de contact", "Intégration Google Maps", "SEO de base pour Google", "Propriété totale des fichiers", "Livraison sous 48h"], primaryButton: { text: "Je commande maintenant", href: "#contact" }, imageSrc: "http://img.b2bpic.net/free-photo/blurred-background-receptionist-working_1203-994.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

29
src/pages/HomePage/sections/Portfolio.tsx Normal file
View File

@@ -0,0 +1,29 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "portfolio" section.
import React from 'react';
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function PortfolioSection(): React.JSX.Element {
return (
<div id="portfolio" data-section="portfolio">
<SectionErrorBoundary name="portfolio">
<FeaturesImageBento
tag="Nos réalisations"
title="Des sites qui convertissent"
description="Découvrez nos dernières créations pour divers secteurs."
items={[
{ title: "Restaurant La Table", description: "Restauration • Réservations x3", imageSrc: "http://img.b2bpic.net/free-photo/halloween-composition-with-space-right_23-2147675382.jpg" },
{ title: "BTP Construction", description: "Artisanat • Demandes de devis accrues", imageSrc: "http://img.b2bpic.net/free-photo/happy-contractors-pointing-white-laptop-display-showing-isolated-blank-screen-wireless-pc-team-builders-holding-computer-with-empty-copyspace-template-posing-studio_482257-60531.jpg" },
{ title: "Beauté & Co", description: "Coiffure • Prise de RDV en ligne", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-women-posing-together-studio_23-2149643152.jpg" },
{ title: "Cabinet dentaire", description: "Santé • Visibilité locale locale", imageSrc: "http://img.b2bpic.net/free-photo/hospital-reception-desk-with-computer-making-healthcare-appointments-patients-with-disease-registration-work-with-medical-checkup-reports-papers-forms-facility-lobby_482257-50665.jpg" },
{ title: "Fleuriste du coin", description: "Commerce • Vente locale", imageSrc: "http://img.b2bpic.net/free-photo/decorative-dreamy-arrangement-with-dried-flowers_23-2151363326.jpg" },
{ title: "Coach Vitalité", description: "Sport • Coaching privé", imageSrc: "http://img.b2bpic.net/free-photo/fitness-health-physical-strength-training-workout-concept_53876-133837.jpg" },
{ title: "Auto École Express", description: "Services • Inscriptions", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-pieces-bread-basket-shop_181624-32196.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

25
src/pages/HomePage/sections/Probleme.tsx Normal file
View File

@@ -0,0 +1,25 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "probleme" section.
import React from 'react';
import FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ProblemeSection(): React.JSX.Element {
return (
<div id="probleme" data-section="probleme">
<SectionErrorBoundary name="probleme">
<FeaturesMediaCards
tag="Pourquoi passer à l'action ?"
title="Ne laissez plus vos clients filer chez la concurrence"
description="À l'ère du tout numérique, une absence de site professionnel vous coûte cher chaque jour."
items={[
{ title: "Perte de nouveaux clients", description: "Vos prospects cherchent sur Google, vous ne leur apparaissez pas. Ils vont chez vos concurrents.", imageSrc: "http://img.b2bpic.net/free-photo/conches-with-chocolate-balls_1220-214.jpg" },
{ title: "Devis perdus", description: "Un site est une vitrine qui travaille 24h/24 pour capturer des demandes de devis automatiquement.", imageSrc: "http://img.b2bpic.net/free-photo/household-problem-woman-pointing-broken-tap-with-jet-water-man-with-suitcase-tools_259150-58295.jpg" },
{ title: "Image dégradée", description: "Dans l'esprit du client, pas de site = pas de confiance. Ne soyez plus perçu comme un amateur.", imageSrc: "http://img.b2bpic.net/free-photo/customer-standing-front-mirror-barbershop_23-2148181953.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

27
src/pages/HomePage/sections/Temoignages.tsx Normal file
View File

@@ -0,0 +1,27 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "temoignages" section.
import React from 'react';
import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function TemoignagesSection(): React.JSX.Element {
return (
<div id="temoignages" data-section="temoignages">
<SectionErrorBoundary name="temoignages">
<TestimonialColumnMarqueeCards
tag="Ils nous ont fait confiance"
title="Des clients conquis par notre rapidité"
description="Découvrez ce que disent nos clients de notre service express."
testimonials={[
{ name: "Marie L.", role: "Boulangère, Lyon", quote: "Site livré en 2 jours, design sublime, j'ai déjà 30% de nouveaux clients.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-having-breakfast_23-2148597005.jpg" },
{ name: "Paul D.", role: "Plombier, Bordeaux", quote: "Enfin une vitrine pro sans payer des milliers d'euros. Très efficace.", imageSrc: "http://img.b2bpic.net/free-photo/builder-handyman-with-construction-tools-house-house-renovation-concept_169016-5873.jpg" },
{ name: "Julie K.", role: "Coiffeuse, Nantes", quote: "La prise de RDV est devenue automatique. Un gain de temps précieux.", imageSrc: "http://img.b2bpic.net/free-photo/stylish-beauty-women-elegent-enjoy-concept_53876-148023.jpg" },
{ name: "Marc T.", role: "Restaurateur, Paris", quote: "Le meilleur investissement pour mon restaurant cette année.", imageSrc: "http://img.b2bpic.net/free-photo/asian-medical-doctor-take-care-explain-senior-elderly-woman-female-patient-wheelchair-with-tablet-looking-camera_554837-54.jpg" },
{ name: "Sophie P.", role: "Coach, Marseille", quote: "Simple, efficace, rapide. Exactement ce dont j'avais besoin.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-accident-treadmill_23-2148419833.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}