Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #1.
This commit is contained in:
307
src/app/page.tsx
307
src/app/page.tsx
@@ -11,7 +11,7 @@ import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarS
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import TextAbout from '@/components/sections/about/TextAbout';
|
||||
import { Award, MapPin, ShoppingBag } from "lucide-react";
|
||||
import { Award, MapPin, ShoppingBag, CheckCircle, Coffee, Heart, 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: "Collectie",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Over Ons", id: "about" },
|
||||
{ name: "Collectie", id: "products" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Marielle Boutique"
|
||||
/>
|
||||
@@ -58,114 +43,38 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDoubleCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Warmte & Luxe in Elke Draad"
|
||||
description="Ervaar de persoonlijke zorg en tijdloze elegantie van Mariëlle. Dé boutique voor de vrouw die kiest voor kwaliteit en persoonlijke aandacht."
|
||||
leftCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-clothing-showroom_482257-79289.jpg",
|
||||
imageAlt: "Luxueuze boutique",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-various-cleaning-products_23-2150829675.jpg",
|
||||
imageAlt: "Boutique interieur",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-girl-pink-pantsuit-sitting-chair-with-shoes-box-knees-paying-by-card-fashion-boutique_574295-3554.jpg",
|
||||
imageAlt: "Fashion boutique",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vintage-light-lamp_1203-3090.jpg",
|
||||
imageAlt: "Boutique stijl",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/client-is-going-buy-clothes-shop_7502-9385.jpg",
|
||||
imageAlt: "High end mode",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-clothing-showroom_482257-79289.jpg", imageAlt: "Luxueuze boutique" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/still-life-various-cleaning-products_23-2150829675.jpg", imageAlt: "Boutique interieur" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-girl-pink-pantsuit-sitting-chair-with-shoes-box-knees-paying-by-card-fashion-boutique_574295-3554.jpg", imageAlt: "Fashion boutique" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/vintage-light-lamp_1203-3090.jpg", imageAlt: "Boutique stijl" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/client-is-going-buy-clothes-shop_7502-9385.jpg", imageAlt: "High end mode" },
|
||||
]}
|
||||
rightCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-checking-two-shirts_23-2147601332.jpg",
|
||||
imageAlt: "Mode display",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg",
|
||||
imageAlt: "Boutique detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-store-with-abstract-concept-architecture_23-2150862148.jpg",
|
||||
imageAlt: "Kwaliteit mode",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/friends-shopping-second-hand-market_23-2149353733.jpg",
|
||||
imageAlt: "Collectie focus",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-buying-stuff-decoration-store_1303-24638.jpg",
|
||||
imageAlt: "Exclusief advies",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Bekijk Collectie",
|
||||
href: "#products",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-checking-two-shirts_23-2147601332.jpg", imageAlt: "Mode display" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94677.jpg", imageAlt: "Boutique detail" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/futuristic-store-with-abstract-concept-architecture_23-2150862148.jpg", imageAlt: "Kwaliteit mode" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/friends-shopping-second-hand-market_23-2149353733.jpg", imageAlt: "Collectie focus" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-buying-stuff-decoration-store_1303-24638.jpg", imageAlt: "Exclusief advies" },
|
||||
]}
|
||||
buttons={[{ text: "Bekijk Collectie", href: "#products" }]}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/excited-women-standing-boutique_23-2147666176.jpg",
|
||||
alt: "Boutique klant 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-couple-lovely-date_23-2148422309.jpg",
|
||||
alt: "Boutique klant 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-elegant-woman-holding-shopping-bags_23-2148624958.jpg",
|
||||
alt: "Boutique klant 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/selfie-happy-latin-black-haired-woman-standing-near-rack-with-dresses-fashion-shop-looking-camera-smiling-boutique-customer-shop-assistant-concept_74855-11953.jpg",
|
||||
alt: "Boutique klant 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/brunette-gorgeous-girl-clothing-store-boutique-black-dress_627829-9092.jpg",
|
||||
alt: "Boutique klant 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/excited-women-standing-boutique_23-2147666176.jpg", alt: "Boutique klant 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/happy-couple-lovely-date_23-2148422309.jpg", alt: "Boutique klant 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-elegant-woman-holding-shopping-bags_23-2148624958.jpg", alt: "Boutique klant 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/selfie-happy-latin-black-haired-woman-standing-near-rack-with-dresses-fashion-shop-looking-camera-smiling-boutique-customer-shop-assistant-concept_74855-11953.jpg", alt: "Boutique klant 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/brunette-gorgeous-girl-clothing-store-boutique-black-dress_627829-9092.jpg", alt: "Boutique klant 5" },
|
||||
]}
|
||||
avatarText="Gewaardeerd door 500+ klanten"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Tijdloze Elegantie",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Persoonlijk Advies",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hoogwaardige Kwaliteit",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Exclusieve Collectie",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Warme Boutique Sfeer",
|
||||
},
|
||||
]}
|
||||
marqueeItems={[{ type: "text", text: "Tijdloze Elegantie" }, { type: "text", text: "Persoonlijk Advies" }, { type: "text", text: "Hoogwaardige Kwaliteit" }, { type: "text", text: "Exclusieve Collectie" }, { type: "text", text: "Warme Boutique Sfeer" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={true}
|
||||
title="Verder dan alleen kleding"
|
||||
/>
|
||||
<TextAbout useInvertedBackground={true} title="Verder dan alleen kleding" />
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
@@ -173,30 +82,10 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Eerlijk Advies",
|
||||
description: "Wij adviseren je als een vriendin, altijd oprecht.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-women-testing-colours_23-2150538671.jpg",
|
||||
buttonIcon: "CheckCircle",
|
||||
},
|
||||
{
|
||||
title: "Warme Gastvrijheid",
|
||||
description: "Geniet van de lekkerste koffie tijdens het passen.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-friends-having-lunch-luxury-restaurant_23-2151081454.jpg",
|
||||
buttonIcon: "Coffee",
|
||||
},
|
||||
{
|
||||
title: "Persoonlijk Contact",
|
||||
description: "Wij houden je op de hoogte van nieuwe items die bij je passen.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-hands-holding-smartphone_23-2149708083.jpg",
|
||||
buttonIcon: "Heart",
|
||||
},
|
||||
{
|
||||
title: "Boutique Ervaring",
|
||||
description: "35km rijden wij voor de persoonlijke service van Mariëlle.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-taking-mirror-photos_23-2149241371.jpg",
|
||||
buttonIcon: "Star",
|
||||
},
|
||||
{ title: "Eerlijk Advies", description: "Wij adviseren je als een vriendin, altijd oprecht.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-women-testing-colours_23-2150538671.jpg", buttonIcon: CheckCircle },
|
||||
{ title: "Warme Gastvrijheid", description: "Geniet van de lekkerste koffie tijdens het passen.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-friends-having-lunch-luxury-restaurant_23-2151081454.jpg", buttonIcon: Coffee },
|
||||
{ title: "Persoonlijk Contact", description: "Wij houden je op de hoogte van nieuwe items die bij je passen.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-hands-holding-smartphone_23-2149708083.jpg", buttonIcon: Heart },
|
||||
{ title: "Boutique Ervaring", description: "35km rijden wij voor de persoonlijke service van Mariëlle.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-taking-mirror-photos_23-2149241371.jpg", buttonIcon: Star },
|
||||
]}
|
||||
title="Jouw beleving, onze passie"
|
||||
description="Waarom klanten van ver komen voor Mariëlle's boutique."
|
||||
@@ -210,42 +99,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Chique Jurk",
|
||||
price: "€149",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bride-s-dress-her-two-bridesmaids-dresses-are-hanging-hangers_8353-9796.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Silk Blouse",
|
||||
price: "€89",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-women-clothes_1385-199.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Lederen Tas",
|
||||
price: "€199",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-coat_1303-4437.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Wollen Sjaal",
|
||||
price: "€59",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-pinecones-beige-shawl-dark-surface_140725-63526.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Designer Blazer",
|
||||
price: "€229",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-buying-cloths-paying-with-cash-shop_1303-19854.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Lederen Laarsjes",
|
||||
price: "€179",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shoemaker-workshop-making-shoes_171337-12296.jpg",
|
||||
},
|
||||
{ id: "1", name: "Chique Jurk", price: "€149", imageSrc: "http://img.b2bpic.net/free-photo/bride-s-dress-her-two-bridesmaids-dresses-are-hanging-hangers_8353-9796.jpg" },
|
||||
{ id: "2", name: "Silk Blouse", price: "€89", imageSrc: "http://img.b2bpic.net/free-photo/fashion-women-clothes_1385-199.jpg" },
|
||||
{ id: "3", name: "Lederen Tas", price: "€199", imageSrc: "http://img.b2bpic.net/free-photo/girl-coat_1303-4437.jpg" },
|
||||
{ id: "4", name: "Wollen Sjaal", price: "€59", imageSrc: "http://img.b2bpic.net/free-photo/top-view-pinecones-beige-shawl-dark-surface_140725-63526.jpg" },
|
||||
{ id: "5", name: "Designer Blazer", price: "€229", imageSrc: "http://img.b2bpic.net/free-photo/young-man-buying-cloths-paying-with-cash-shop_1303-19854.jpg" },
|
||||
{ id: "6", name: "Lederen Laarsjes", price: "€179", imageSrc: "http://img.b2bpic.net/free-photo/shoemaker-workshop-making-shoes_171337-12296.jpg" },
|
||||
]}
|
||||
title="Onze Collectie"
|
||||
description="Tijdloze stukken voor iedere gelegenheid."
|
||||
@@ -259,27 +118,9 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "12+",
|
||||
title: "Jaar Ervaring",
|
||||
description: "Passie voor mode",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "35km",
|
||||
title: "Gemiddelde Reis",
|
||||
description: "Klanten komen van ver",
|
||||
icon: MapPin,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "500+",
|
||||
title: "Stijlvolle Looks",
|
||||
description: "Elk seizoen nieuw",
|
||||
icon: ShoppingBag,
|
||||
},
|
||||
{ id: "m1", value: "12+", title: "Jaar Ervaring", description: "Passie voor mode", icon: Award },
|
||||
{ id: "m2", value: "35km", title: "Gemiddelde Reis", description: "Klanten komen van ver", icon: MapPin },
|
||||
{ id: "m3", value: "500+", title: "Stijlvolle Looks", description: "Elk seizoen nieuw", icon: ShoppingBag },
|
||||
]}
|
||||
title="Mariëlle in Cijfers"
|
||||
description="Kwaliteit gewaardeerd door onze community."
|
||||
@@ -292,41 +133,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah",
|
||||
role: "Klant",
|
||||
testimonial: "De koffie is geweldig en het advies nog beter.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-senior-looking-notebook_23-2148346228.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Lotte",
|
||||
role: "Klant",
|
||||
testimonial: "Ik rijd 40 minuten, maar het is het altijd waard.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-women-shopping_23-2149241334.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Annelies",
|
||||
role: "Klant",
|
||||
testimonial: "Eindelijk een boutique die echt met je meedenkt.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shopping-concept-with-happy-women_23-2147705117.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Marloes",
|
||||
role: "Klant",
|
||||
testimonial: "Mariëlle heeft altijd zulke goede stijl-tips.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-woman-portrait_23-2149213189.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Sophie",
|
||||
role: "Klant",
|
||||
testimonial: "De sfeer is zo persoonlijk en warm.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-with-shopping-cart-by-grocery-store_1303-28934.jpg",
|
||||
},
|
||||
{ id: "1", name: "Sarah", role: "Klant", testimonial: "De koffie is geweldig en het advies nog beter.", imageSrc: "http://img.b2bpic.net/free-photo/happy-senior-looking-notebook_23-2148346228.jpg" },
|
||||
{ id: "2", name: "Lotte", role: "Klant", testimonial: "Ik rijd 40 minuten, maar het is het altijd waard.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-women-shopping_23-2149241334.jpg" },
|
||||
{ id: "3", name: "Annelies", role: "Klant", testimonial: "Eindelijk een boutique die echt met je meedenkt.", imageSrc: "http://img.b2bpic.net/free-photo/shopping-concept-with-happy-women_23-2147705117.jpg" },
|
||||
{ id: "4", name: "Marloes", role: "Klant", testimonial: "Mariëlle heeft altijd zulke goede stijl-tips.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-woman-portrait_23-2149213189.jpg" },
|
||||
{ id: "5", name: "Sophie", role: "Klant", testimonial: "De sfeer is zo persoonlijk en warm.", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-shopping-cart-by-grocery-store_1303-28934.jpg" },
|
||||
]}
|
||||
title="Wat klanten zeggen"
|
||||
description="Ervaringen van onze loyale community."
|
||||
@@ -336,9 +147,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Bezoek Mariëlle Boutique — Kom langs voor een persoonlijk advies en een kop koffie."
|
||||
/>
|
||||
</div>
|
||||
@@ -346,32 +155,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "Dorpsstraat 123",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "012-3456789",
|
||||
href: "tel:0123456789",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Service",
|
||||
items: [
|
||||
{
|
||||
label: "Openingstijden",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Plan Route",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Contact", items: [{ label: "Dorpsstraat 123", href: "#" }, { label: "012-3456789", href: "tel:0123456789" }] },
|
||||
{ title: "Service", items: [{ label: "Openingstijden", href: "#" }, { label: "Plan Route", href: "#" }] },
|
||||
]}
|
||||
logoText="Mariëlle Boutique"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user