Merge version_2 into main #2
257
src/app/page.tsx
257
src/app/page.tsx
@@ -3,15 +3,15 @@
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { Award, Building, Users } from "lucide-react";
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import { Award, Building, Users, Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -31,26 +31,11 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Over ons",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Diensten",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Over ons", id: "about" },
|
||||
{ name: "Diensten", id: "services" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="JWBouw"
|
||||
/>
|
||||
@@ -58,17 +43,10 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="JWBouw - Uw Betrouwbare Bouwpartner in Zwolle"
|
||||
description="Van nieuwbouw en verbouw tot complete renovatie: wij realiseren uw woonwensen met vakmanschap en oog voor detail."
|
||||
buttons={[
|
||||
{
|
||||
text: "Vrijblijvende offerte",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Vrijblijvende offerte", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-experienced-carpenter-his-younger-employee_329181-15669.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
@@ -78,21 +56,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Vakmanschap sinds 2017"
|
||||
metrics={[
|
||||
{
|
||||
icon: Building,
|
||||
label: "Projecten succesvol afgerond",
|
||||
value: "100+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Gemiddelde beoordeling",
|
||||
value: "4.9",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Tevreden klanten",
|
||||
value: "75+",
|
||||
},
|
||||
{ icon: Building, label: "Projecten succesvol afgerond", value: "100+" },
|
||||
{ icon: Award, label: "Gemiddelde beoordeling", value: "4.9" },
|
||||
{ icon: Users, label: "Tevreden klanten", value: "75+" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -104,21 +70,9 @@ export default function LandingPage() {
|
||||
title="Onze Specialisaties"
|
||||
description="Wij bieden een breed scala aan bouwdiensten voor zowel particulieren als bedrijven in Zwolle en omgeving."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Nieuwbouw",
|
||||
content: "Wij regelen de complete bouw van uw woning of bedrijfspand van begin tot eind.",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Verbouw & Aanbouw",
|
||||
content: "Expertise in alle soorten verbouwingen en realisatie van extra woonruimte aan uw woning.",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Onderhoud",
|
||||
content: "Behoud de waarde van uw pand met vakkundig onderhoud en kleine klussen.",
|
||||
},
|
||||
{ id: "s1", title: "Nieuwbouw", content: "Wij regelen de complete bouw van uw woning of bedrijfspand van begin tot eind." },
|
||||
{ id: "s2", title: "Verbouw & Aanbouw", content: "Expertise in alle soorten verbouwingen en realisatie van extra woonruimte aan uw woning." },
|
||||
{ id: "s3", title: "Onderhoud", content: "Behoud de waarde van uw pand met vakkundig onderhoud en kleine klussen." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-15.jpg?_wi=1"
|
||||
mediaAnimation="blur-reveal"
|
||||
@@ -132,42 +86,9 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Ervaren Vaklieden",
|
||||
price: "Professioneel",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sunny-summer-morning-young-athletic-woman-doing-handstand-city-park-street-modern-urban-buildings-exercise-outdoors-healthy-lifestyle_146671-15176.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Helder Advies",
|
||||
price: "Eerlijk",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architect-working-modern-office_23-2148242893.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Betaalbare Kwaliteit",
|
||||
price: "Transparant",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architect-working-blueprints-her-desk-working-new-projects-architecture-design_482257-33181.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Op Tijd Afgerond",
|
||||
price: "Betrouwbaar",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architects-front-brick-wall_23-2147813094.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Netjes Afgewerkt",
|
||||
price: "Strak",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-composition-with-different-construction-tools-wooden-background_169016-24026.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Lokale Expertise",
|
||||
price: "Zwolle",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-measuring-tools-desk-still-life_23-2150440922.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Ervaren Vaklieden", price: "Professioneel", imageSrc: "http://img.b2bpic.net/free-photo/sunny-summer-morning-young-athletic-woman-doing-handstand-city-park-street-modern-urban-buildings-exercise-outdoors-healthy-lifestyle_146671-15176.jpg?_wi=1" },
|
||||
{ id: "p2", name: "Helder Advies", price: "Eerlijk", imageSrc: "http://img.b2bpic.net/free-photo/architect-working-modern-office_23-2148242893.jpg?_wi=1" },
|
||||
{ id: "p3", name: "Betaalbare Kwaliteit", price: "Transparant", imageSrc: "http://img.b2bpic.net/free-photo/architect-working-blueprints-her-desk-working-new-projects-architecture-design_482257-33181.jpg" },
|
||||
]}
|
||||
title="Waarom kiezen voor JWBouw?"
|
||||
description="Kwaliteit, betrouwbaarheid en heldere afspraken staan bij ons centraal."
|
||||
@@ -175,128 +96,60 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Rogier Cappon",
|
||||
date: "5 jaar geleden",
|
||||
title: "Klant",
|
||||
quote: "Zeer tevreden over de complete zolderverbouwing. Netjes gewerkt en prima prijs.",
|
||||
tag: "Top",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/crazy-young-man-jumping-happy-expression_1194-4849.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-experienced-carpenter-his-younger-employee_329181-15669.jpg?_wi=2",
|
||||
imageAlt: "happy customer portrait",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Jan Joost",
|
||||
date: "5 jaar geleden",
|
||||
title: "Klant",
|
||||
quote: "Jan heeft ons fantastisch geholpen met nieuwe trappen. Zeer tevreden over de kwaliteit.",
|
||||
tag: "Top",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/lovely-senior-couple-dancing-together_23-2148268622.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-builder-orange-work-clothes-yellow-hardhat-with-pencil-ear-dreamily-looking-camera-with-scaffolding-background_574295-1578.jpg",
|
||||
imageAlt: "happy customer portrait",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Suzanne Drees",
|
||||
date: "5 jaar geleden",
|
||||
title: "Klant",
|
||||
quote: "Zeer professioneel voor een betaalbare prijs. Tevens goed advies ontvangen.",
|
||||
tag: "Aanrader",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/happy-female-office-workers-thumbing-up-smiling-two-cheerful-professional-businesswomen-standing-together-posing-meeting-room-teamwork-business-success-cooperation-concept_74855-7378.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-15.jpg?_wi=2",
|
||||
imageAlt: "happy customer portrait",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Klant 4",
|
||||
date: "2023",
|
||||
title: "Klant",
|
||||
quote: "Top gozer! Weet precies waar hij over praat. Zou hem iedereen adviseren.",
|
||||
tag: "Top",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/front-view-father-daughter-with-christmas_23-2148730788.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sunny-summer-morning-young-athletic-woman-doing-handstand-city-park-street-modern-urban-buildings-exercise-outdoors-healthy-lifestyle_146671-15176.jpg?_wi=2",
|
||||
imageAlt: "happy customer portrait",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Klant 5",
|
||||
date: "2023",
|
||||
title: "Klant",
|
||||
quote: "Snel, vakkundig en meedenkend met het bouwproces.",
|
||||
tag: "Super",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/two-people-working-warehouse_329181-12819.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architect-working-modern-office_23-2148242893.jpg?_wi=2",
|
||||
imageAlt: "happy customer portrait",
|
||||
},
|
||||
]}
|
||||
<TestimonialCardThirteen
|
||||
title="Wat onze klanten zeggen"
|
||||
description="Ervaringen van tevreden klanten uit Zwolle."
|
||||
showRating={true}
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Rogier Cappon", handle: "@rogier", testimonial: "Zeer tevreden over de complete zolderverbouwing. Netjes gewerkt en prima prijs.", rating: 5, icon: Star },
|
||||
{ id: "t2", name: "Jan Joost", handle: "@janj", testimonial: "Jan heeft ons fantastisch geholpen met nieuwe trappen. Zeer tevreden over de kwaliteit.", rating: 5, icon: Star },
|
||||
{ id: "t3", name: "Suzanne Drees", handle: "@suzanned", testimonial: "Zeer professioneel voor een betaalbare prijs. Tevens goed advies ontvangen.", rating: 5, icon: Star }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Waar is JWBouw gevestigd?",
|
||||
content: "Wij zijn gevestigd aan de Lichtmisweg 4 in Zwolle.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Kan ik een vrijblijvende offerte aanvragen?",
|
||||
content: "Zeker, neem contact met ons op via telefoon of e-mail voor de mogelijkheden.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Welke diensten bieden jullie aan?",
|
||||
content: "Wij doen nieuwbouw, verbouw, aanbouw, onderhoud en kleine klussen.",
|
||||
},
|
||||
]}
|
||||
<FaqSplitMedia
|
||||
title="Veelgestelde Vragen"
|
||||
description="Hier vindt u antwoorden op de meest voorkomende vragen over onze diensten."
|
||||
faqsAnimation="blur-reveal"
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Waar is JWBouw gevestigd?", content: "Wij zijn gevestigd aan de Lichtmisweg 4 in Zwolle." },
|
||||
{ id: "f2", title: "Kan ik een vrijblijvende offerte aanvragen?", content: "Zeker, neem contact met ons op via telefoon of e-mail voor de mogelijkheden." },
|
||||
{ id: "f3", title: "Welke diensten bieden jullie aan?", content: "Wij doen nieuwbouw, verbouw, aanbouw, onderhoud en kleine klussen." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/architects-front-brick-wall_23-2147813094.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
<ContactCenter
|
||||
tag="Contact"
|
||||
title="Laten we bouwen"
|
||||
description="Heeft u plannen voor een verbouwing? Neem contact op voor een kennismaking."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "cell-wave",
|
||||
}}
|
||||
text="Heeft u plannen voor een verbouwing? Neem vrijblijvend contact met ons op: info@jwbouw-zwolle.nl | 06-510 691 98"
|
||||
buttons={[
|
||||
{
|
||||
text: "Stuur ons een bericht",
|
||||
href: "mailto:info@jwbouw-zwolle.nl",
|
||||
},
|
||||
]}
|
||||
buttonText="Stuur bericht"
|
||||
onSubmit={(email) => console.log(email)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
<FooterLogoEmphasis
|
||||
logoText="JWBouw Zwolle"
|
||||
leftLink={{
|
||||
text: "Lichtmisweg 4, 8035 PL Zwolle",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "© 2024 JWBouw-Zwolle",
|
||||
href: "#",
|
||||
}}
|
||||
columns={[
|
||||
{ items: [{ label: "Nieuwbouw", href: "#services" }, { label: "Verbouw", href: "#services" }] },
|
||||
{ items: [{ label: "Over ons", href: "#about" }, { label: "Contact", href: "#contact" }] },
|
||||
{ items: [{ label: "Lichtmisweg 4, Zwolle", href: "#" }, { label: "06-510 691 98", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user