Merge version_1 into main #2
487
src/app/page.tsx
487
src/app/page.tsx
@@ -16,339 +16,180 @@ import { CheckCircle, Shield, Sparkles } from "lucide-react";
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Launderette"
|
||||
button={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Launderette"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
title="Freshness, Delivered to Your Door."
|
||||
description="Premium laundry and expert ironing services that keep your clothes looking impeccable. Professional care for your everyday and delicate garments."
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-gray-sofa-with-basket-folded-clothes-small-table-near-it_181624-47981.jpg?_wi=1",
|
||||
imageAlt: "Fresh laundry",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-inside-laundromat-room-with-vintage-decor-washing-machines_23-2151176248.jpg?_wi=1",
|
||||
imageAlt: "Modern facility",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-woman-drinking-coffee-ironing-clothes-laundry-room_839833-31869.jpg?_wi=1",
|
||||
imageAlt: "Organized ironing",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/basket-clothes_93675-130112.jpg",
|
||||
imageAlt: "Fresh laundry pile",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/salesman-hypermarket-wearing-medical-mask-demonstrates-his-clients-new-washing-machine_93675-134475.jpg",
|
||||
imageAlt: "Clean linen",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Freshness, Delivered to Your Door."
|
||||
description="Premium laundry and expert ironing services that keep your clothes looking impeccable. Professional care for your everyday and delicate garments."
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-gray-sofa-with-basket-folded-clothes-small-table-near-it_181624-47981.jpg", imageAlt: "Fresh laundry" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/view-inside-laundromat-room-with-vintage-decor-washing-machines_23-2151176248.jpg", imageAlt: "Modern facility" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-woman-drinking-coffee-ironing-clothes-laundry-room_839833-31869.jpg", imageAlt: "Organized ironing" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/basket-clothes_93675-130112.jpg", imageAlt: "Fresh laundry pile" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/salesman-hypermarket-wearing-medical-mask-demonstrates-his-clients-new-washing-machine_93675-134475.jpg", imageAlt: "Clean linen" },
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Care You Can Trust"
|
||||
description="At Launderette, we believe your clothes deserve professional attention. Using eco-friendly cleaning methods and expert hand-ironing, we return your garments pristine."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Precision Ironing",
|
||||
description: "Expertly pressed for a sharp look.",
|
||||
},
|
||||
{
|
||||
title: "Eco-Friendly Cleaning",
|
||||
description: "Gentle on clothes and the environment.",
|
||||
},
|
||||
{
|
||||
title: "Convenient Pickup",
|
||||
description: "Door-to-door service included.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-servant-doing-chores-around-house_23-2149508123.jpg"
|
||||
imageAlt="Professional ironing and cleaning"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Care You Can Trust"
|
||||
description="At Launderette, we believe your clothes deserve professional attention. Using eco-friendly cleaning methods and expert hand-ironing, we return your garments pristine."
|
||||
bulletPoints={[
|
||||
{ title: "Precision Ironing", description: "Expertly pressed for a sharp look." },
|
||||
{ title: "Eco-Friendly Cleaning", description: "Gentle on clothes and the environment." },
|
||||
{ title: "Convenient Pickup", description: "Door-to-door service included." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-servant-doing-chores-around-house_23-2149508123.jpg"
|
||||
imageAlt="Professional ironing and cleaning"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Full Wash & Dry",
|
||||
description: "Expert care for your daily wear.",
|
||||
icon: Sparkles,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/washing-dryer-machine-inside-view-drum_169016-13048.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/four-laundry-service-set-icons_24877-76811.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-gray-sofa-with-basket-folded-clothes-small-table-near-it_181624-47981.jpg?_wi=2",
|
||||
imageAlt: "washing clothes machine icon",
|
||||
},
|
||||
{
|
||||
title: "Ironing Excellence",
|
||||
description: "Sharp creases and perfectly smooth fabrics.",
|
||||
icon: CheckCircle,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-male-ironing-clean-towels-pink-background-clean-effort-housework-man-work-clothes-home_140725-156122.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-servant-ironing-clothing_23-2149530868.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-inside-laundromat-room-with-vintage-decor-washing-machines_23-2151176248.jpg?_wi=2",
|
||||
imageAlt: "washing clothes machine icon",
|
||||
},
|
||||
{
|
||||
title: "Dry Cleaning",
|
||||
description: "Specialist care for delicate materials.",
|
||||
icon: Shield,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/clothing-rack-with-sale-clothes_23-2148695609.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-with-furoshiki-package_23-2150643022.jpg",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-woman-drinking-coffee-ironing-clothes-laundry-room_839833-31869.jpg?_wi=2",
|
||||
imageAlt: "washing clothes machine icon",
|
||||
},
|
||||
]}
|
||||
title="Our Professional Services"
|
||||
description="Comprehensive cleaning, washing, and ironing solutions tailored for your lifestyle."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Full Wash & Dry", description: "Expert care for your daily wear.", icon: Sparkles,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/washing-dryer-machine-inside-view-drum_169016-13048.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/four-laundry-service-set-icons_24877-76811.jpg" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Ironing Excellence", description: "Sharp creases and perfectly smooth fabrics.", icon: CheckCircle,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-male-ironing-clean-towels-pink-background-clean-effort-housework-man-work-clothes-home_140725-156122.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/man-servant-ironing-clothing_23-2149530868.jpg" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Dry Cleaning", description: "Specialist care for delicate materials.", icon: Shield,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/clothing-rack-with-sale-clothes_23-2148695609.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-with-furoshiki-package_23-2150643022.jpg" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Our Professional Services"
|
||||
description="Comprehensive cleaning, washing, and ironing solutions tailored for your lifestyle."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
price: "£25",
|
||||
name: "Weekly Wash",
|
||||
features: [
|
||||
"1 Basket",
|
||||
"Standard Ironing",
|
||||
"Free Pickup",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select Plan",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
price: "£45",
|
||||
name: "Family Pack",
|
||||
features: [
|
||||
"3 Baskets",
|
||||
"Delicate Care",
|
||||
"Priority Service",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select Plan",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "premium",
|
||||
price: "£65",
|
||||
name: "Executive Ironing",
|
||||
features: [
|
||||
"20 Shirts",
|
||||
"Dry Cleaning",
|
||||
"Same Day Delivery",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select Plan",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Simple, Fair Pricing"
|
||||
description="Transparent plans for all your laundering needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "basic", price: "£25", name: "Weekly Wash", features: ["1 Basket", "Standard Ironing", "Free Pickup"],
|
||||
buttons: [{ text: "Select Plan" }],
|
||||
},
|
||||
{
|
||||
id: "pro", price: "£45", name: "Family Pack", features: ["3 Baskets", "Delicate Care", "Priority Service"],
|
||||
buttons: [{ text: "Select Plan" }],
|
||||
},
|
||||
{
|
||||
id: "premium", price: "£65", name: "Executive Ironing", features: ["20 Shirts", "Dry Cleaning", "Same Day Delivery"],
|
||||
buttons: [{ text: "Select Plan" }],
|
||||
},
|
||||
]}
|
||||
title="Simple, Fair Pricing"
|
||||
description="Transparent plans for all your laundering needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
role: "Client",
|
||||
company: "Local Resident",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-correcting-grammar-mistakes_23-2150171372.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark D.",
|
||||
role: "Client",
|
||||
company: "Busy Executive",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-successful-middle-aged-business-leader_1262-4872.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily R.",
|
||||
role: "Client",
|
||||
company: "Local Resident",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-choosing-clothes-wardrobe_158595-7605.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David K.",
|
||||
role: "Client",
|
||||
company: "Local Resident",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/content-young-man-smiling_74855-2722.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Julia M.",
|
||||
role: "Client",
|
||||
company: "Local Resident",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-smiling-older-woman_23-2149082524.jpg",
|
||||
},
|
||||
]}
|
||||
title="Loved by Our Customers"
|
||||
description="Join hundreds of happy locals enjoying crisp, clean clothes."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah J.", role: "Client", company: "Local Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-correcting-grammar-mistakes_23-2150171372.jpg" },
|
||||
{ id: "2", name: "Mark D.", role: "Client", company: "Busy Executive", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confident-successful-middle-aged-business-leader_1262-4872.jpg" },
|
||||
{ id: "3", name: "Emily R.", role: "Client", company: "Local Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-choosing-clothes-wardrobe_158595-7605.jpg" },
|
||||
{ id: "4", name: "David K.", role: "Client", company: "Local Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/content-young-man-smiling_74855-2722.jpg" },
|
||||
{ id: "5", name: "Julia M.", role: "Client", company: "Local Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-smiling-older-woman_23-2149082524.jpg" },
|
||||
]}
|
||||
title="Loved by Our Customers"
|
||||
description="Join hundreds of happy locals enjoying crisp, clean clothes."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How does pickup work?",
|
||||
content: "Just schedule online, we collect from your door.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "What is the turnaround?",
|
||||
content: "Standard service takes 24-48 hours.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Is dry cleaning included?",
|
||||
content: "Yes, we offer specialized dry cleaning options.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Questions? We've Got Answers"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "How does pickup work?", content: "Just schedule online, we collect from your door." },
|
||||
{ id: "q2", title: "What is the turnaround?", content: "Standard service takes 24-48 hours." },
|
||||
{ id: "q3", title: "Is dry cleaning included?", content: "Yes, we offer specialized dry cleaning options." },
|
||||
]}
|
||||
sideTitle="Questions? We've Got Answers"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
text="Ready to get fresh? Let us take care of the laundry while you focus on what really matters."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us Now",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
text="Ready to get fresh? Let us take care of the laundry while you focus on what really matters."
|
||||
buttons={[{ text: "Contact Us Now", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Launderette"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Launderette"
|
||||
columns={[
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Services", href: "#services" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user