Merge version_1 into main #2
270
src/app/page.tsx
270
src/app/page.tsx
@@ -10,8 +10,8 @@ import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis'
|
||||
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import { Award, CheckCircle, Users } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
@@ -32,22 +32,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Producten",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Producten", id: "products" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Haarlem Schuttingen"
|
||||
/>
|
||||
@@ -55,48 +43,17 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
title="Uw Schutting in Haarlem en Omgeving"
|
||||
description="Wij plaatsen de meest duurzame en elegante houten schuttingen in regio Haarlem. Vakmanschap waar u jarenlang van geniet."
|
||||
buttons={[
|
||||
{
|
||||
text: "Offerte aanvragen",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Offerte aanvragen", href: "#contact" }]}
|
||||
carouselItems={[
|
||||
{
|
||||
id: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-social-distancing-concept_23-2148740142.jpg?_wi=1",
|
||||
imageAlt: "Fence 1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pine-branches-white-wooden-fence_1372-71.jpg",
|
||||
imageAlt: "Fence 2",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/architecture-resort-lifestyles-phangan-sunny_1253-673.jpg",
|
||||
imageAlt: "Fence 3",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wall-trees_1417-1661.jpg",
|
||||
imageAlt: "Fence 4",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/trees-with-leaves-cloudy-day_58702-10709.jpg",
|
||||
imageAlt: "Fence 5",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/carpenter-man-taking-measures-wood-plank_23-2148748813.jpg",
|
||||
imageAlt: "Fence 6",
|
||||
},
|
||||
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-social-distancing-concept_23-2148740142.jpg", imageAlt: "Fence 1" },
|
||||
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/pine-branches-white-wooden-fence_1372-71.jpg", imageAlt: "Fence 2" },
|
||||
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/architecture-resort-lifestyles-phangan-sunny_1253-673.jpg", imageAlt: "Fence 3" },
|
||||
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/wall-trees_1417-1661.jpg", imageAlt: "Fence 4" },
|
||||
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/trees-with-leaves-cloudy-day_58702-10709.jpg", imageAlt: "Fence 5" },
|
||||
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/carpenter-man-taking-measures-wood-plank_23-2148748813.jpg", imageAlt: "Fence 6" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -106,21 +63,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Waarom Haarlem Schuttingen?"
|
||||
metrics={[
|
||||
{
|
||||
label: "Jaren Ervaring",
|
||||
value: "15+",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
label: "Tevreden Klanten",
|
||||
value: "500+",
|
||||
icon: Users,
|
||||
},
|
||||
{
|
||||
label: "Schuttingen Geplaatst",
|
||||
value: "1200+",
|
||||
icon: CheckCircle,
|
||||
},
|
||||
{ label: "Jaren Ervaring", value: "15+", icon: Award },
|
||||
{ label: "Tevreden Klanten", value: "500+", icon: Users },
|
||||
{ label: "Schuttingen Geplaatst", value: "1200+", icon: CheckCircle },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -133,29 +78,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Duurzaam Hout",
|
||||
description: "Wij gebruiken uitsluitend FSC-gecertificeerd hout van de hoogste kwaliteit.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-wooden-fence_1122-2087.jpg",
|
||||
imageAlt: "Duurzaam",
|
||||
},
|
||||
title: "Duurzaam Hout", description: "Wij gebruiken uitsluitend FSC-gecertificeerd hout van de hoogste kwaliteit.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-wooden-fence_1122-2087.jpg", imageAlt: "Duurzaam"},
|
||||
items: [
|
||||
{
|
||||
icon: CheckCircle,
|
||||
text: "Lange levensduur",
|
||||
},
|
||||
{
|
||||
icon: CheckCircle,
|
||||
text: "Onderhoudsvriendelijk",
|
||||
},
|
||||
{
|
||||
icon: CheckCircle,
|
||||
text: "Eco-vriendelijk",
|
||||
},
|
||||
{ icon: CheckCircle, text: "Lange levensduur" },
|
||||
{ icon: CheckCircle, text: "Onderhoudsvriendelijk" },
|
||||
{ icon: CheckCircle, text: "Eco-vriendelijk" },
|
||||
],
|
||||
reverse: false,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-social-distancing-concept_23-2148740142.jpg?_wi=2",
|
||||
imageAlt: "durable cedar garden fence",
|
||||
},
|
||||
]}
|
||||
title="Kwaliteit in elk Detail"
|
||||
@@ -170,42 +100,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Horizontaal Design",
|
||||
price: "vanaf €150/m",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wood-background-texture_1339-6283.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Verticaal Klassiek",
|
||||
price: "vanaf €130/m",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-shot-woman-passing-by-gate_23-2148206696.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Lattice Schutting",
|
||||
price: "vanaf €120/m",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gridlike-fence-pattern-garden_346278-1300.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Beton-Hout Mix",
|
||||
price: "vanaf €180/m",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/metallic-straw-fake-leaf-with-copy-space_23-2148289757.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Rustiek Hout",
|
||||
price: "vanaf €110/m",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wood-jalousie_1182-775.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Maatwerk Schutting",
|
||||
price: "Op aanvraag",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/metal-fence-garden-with-trees-wall_181624-38170.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Horizontaal Design", price: "vanaf €150/m", imageSrc: "http://img.b2bpic.net/free-photo/wood-background-texture_1339-6283.jpg" },
|
||||
{ id: "p2", name: "Verticaal Klassiek", price: "vanaf €130/m", imageSrc: "http://img.b2bpic.net/free-photo/side-shot-woman-passing-by-gate_23-2148206696.jpg" },
|
||||
{ id: "p3", name: "Lattice Schutting", price: "vanaf €120/m", imageSrc: "http://img.b2bpic.net/free-photo/gridlike-fence-pattern-garden_346278-1300.jpg" },
|
||||
{ id: "p4", name: "Beton-Hout Mix", price: "vanaf €180/m", imageSrc: "http://img.b2bpic.net/free-photo/metallic-straw-fake-leaf-with-copy-space_23-2148289757.jpg" },
|
||||
{ id: "p5", name: "Rustiek Hout", price: "vanaf €110/m", imageSrc: "http://img.b2bpic.net/free-photo/wood-jalousie_1182-775.jpg" },
|
||||
{ id: "p6", name: "Maatwerk Schutting", price: "Op aanvraag", imageSrc: "http://img.b2bpic.net/free-photo/metal-fence-garden-with-trees-wall_181624-38170.jpg" },
|
||||
]}
|
||||
title="Onze Modellen"
|
||||
description="Van strak design tot klassiek hout, wij hebben de oplossing voor elke tuin."
|
||||
@@ -218,60 +118,16 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Jeroen de Vries",
|
||||
role: "Haarlem",
|
||||
company: "Woonwijk",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-smiling-female-model-sitting-couch-with-smartphone-looking-happy-camera-scrolling_1258-201947.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Annelies Bakker",
|
||||
role: "Heemstede",
|
||||
company: "Woonwijk",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-senior-couple-with-water-hose_23-2148256621.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Mark Janssen",
|
||||
role: "Haarlem",
|
||||
company: "Woonwijk",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-blonde-girl-tulle-skirt-having-fun-stairs-she-is-smiling-down_197531-617.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sophie Klaassen",
|
||||
role: "Overveen",
|
||||
company: "Woonwijk",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-handshake-teamwork-project-success_23-2148894105.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Pieter Smit",
|
||||
role: "Haarlem",
|
||||
company: "Woonwijk",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-love-garden_23-2147986401.jpg",
|
||||
},
|
||||
{ id: "1", name: "Jeroen de Vries", role: "Haarlem", company: "Woonwijk", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-smiling-female-model-sitting-couch-with-smartphone-looking-happy-camera-scrolling_1258-201947.jpg" },
|
||||
{ id: "2", name: "Annelies Bakker", role: "Heemstede", company: "Woonwijk", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-senior-couple-with-water-hose_23-2148256621.jpg" },
|
||||
{ id: "3", name: "Mark Janssen", role: "Haarlem", company: "Woonwijk", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/attractive-blonde-girl-tulle-skirt-having-fun-stairs-she-is-smiling-down_197531-617.jpg" },
|
||||
{ id: "4", name: "Sophie Klaassen", role: "Overveen", company: "Woonwijk", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/colleagues-handshake-teamwork-project-success_23-2148894105.jpg" },
|
||||
{ id: "5", name: "Pieter Smit", role: "Haarlem", company: "Woonwijk", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-couple-love-garden_23-2147986401.jpg" },
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "4.9/5",
|
||||
label: "Gemiddelde Score",
|
||||
},
|
||||
{
|
||||
value: "100%",
|
||||
label: "Tevredenheid",
|
||||
},
|
||||
{
|
||||
value: "24h",
|
||||
label: "Reactietijd",
|
||||
},
|
||||
{ value: "4.9/5", label: "Gemiddelde Score" },
|
||||
{ value: "100%", label: "Tevredenheid" },
|
||||
{ value: "24h", label: "Reactietijd" },
|
||||
]}
|
||||
title="Wat klanten zeggen"
|
||||
description="Ervaringen van onze tevreden klanten in en rond Haarlem."
|
||||
@@ -283,21 +139,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Binnen welk gebied werken jullie?",
|
||||
content: "Wij werken primair in Haarlem en omgeving (straal van 25km).",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Hoe lang duurt de plaatsing?",
|
||||
content: "Een gemiddelde tuin wordt binnen 2 werkdagen volledig omheind.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Geven jullie garantie?",
|
||||
content: "Ja, wij bieden standaard 5 jaar garantie op al onze constructies.",
|
||||
},
|
||||
{ id: "f1", title: "Binnen welk gebied werken jullie?", content: "Wij werken primair in Haarlem en omgeving (straal van 25km)." },
|
||||
{ id: "f2", title: "Hoe lang duurt de plaatsing?", content: "Een gemiddelde tuin wordt binnen 2 werkdagen volledig omheind." },
|
||||
{ id: "f3", title: "Geven jullie garantie?", content: "Ja, wij bieden standaard 5 jaar garantie op al onze constructies." },
|
||||
]}
|
||||
title="Veelgestelde Vragen"
|
||||
description="Alles wat u moet weten over onze service."
|
||||
@@ -310,14 +154,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Haarlem Bouw",
|
||||
"TuinDesign B.V.",
|
||||
"Houtimport Noord",
|
||||
"Tuinvisie",
|
||||
"Natuurlijk Tuinieren",
|
||||
"Haarlem Bouw",
|
||||
"Hout & Co",
|
||||
]}
|
||||
"Haarlem Bouw", "TuinDesign B.V.", "Houtimport Noord", "Tuinvisie", "Natuurlijk Tuinieren", "Haarlem Bouw", "Hout & Co"]}
|
||||
title="Wij werken samen met"
|
||||
description="Lokale partners en leveranciers."
|
||||
/>
|
||||
@@ -326,9 +163,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact"
|
||||
title="Vraag uw vrijblijvende offerte aan"
|
||||
description="Vertel ons over uw droomtuin en wij nemen contact op."
|
||||
@@ -342,30 +177,15 @@ export default function LandingPage() {
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Projecten",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{ label: "Home", href: "#hero" },
|
||||
{ label: "Projecten", href: "#products" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user