240 lines
11 KiB
TypeScript
240 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
|
import MediaAbout from '@/components/sections/about/MediaAbout';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import { CheckCircle, Clock, Leaf, Shield, ShieldCheck, Sparkles, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="grid"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "home"},
|
|
{
|
|
name: "Services", id: "services"},
|
|
{
|
|
name: "Pricing", id: "pricing"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="Clarissa's Magic Touch"
|
|
/>
|
|
</div>
|
|
|
|
<div id="home" data-section="home">
|
|
<HeroSplit
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
title="A Spotless Home, The Magic Touch Way."
|
|
description="Experience professional, reliable cleaning services tailored to your needs. Let us transform your home into a sanctuary of cleanliness."
|
|
buttons={[
|
|
{
|
|
text: "Book Now", href: "#contact"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/closeup-hand-glove-cleaning-table-with-foam-detergent_1098-19033.jpg?_wi=1"
|
|
mediaAnimation="blur-reveal"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/high-angle-woman-cleaning-table_23-2148465007.jpg", alt: "Client avatar 1"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/cropped-woman-spraying-detergent-coffee-table_1098-19037.jpg", alt: "Client avatar 2"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/smiling-young-housekeeper-wiping-white-table-with-cloth-home_23-2148222249.jpg", alt: "Client avatar 3"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/woman-cleaning-kitchen-worktop_1170-2614.jpg", alt: "Client avatar 4"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/older-woman-drinking-coffee-smiling-house-white-shirt-daytime_176474-4942.jpg", alt: "Client avatar 5"},
|
|
]}
|
|
avatarText="Trusted by 500+ local families"
|
|
marqueeItems={[
|
|
{
|
|
type: "text-icon", text: "Deep Clean", icon: Sparkles,
|
|
},
|
|
{
|
|
type: "text-icon", text: "Eco-Friendly", icon: Leaf,
|
|
},
|
|
{
|
|
type: "text-icon", text: "Insured", icon: ShieldCheck,
|
|
},
|
|
{
|
|
type: "text-icon", text: "On-Time", icon: Clock,
|
|
},
|
|
{
|
|
type: "text-icon", text: "Satisfaction Guaranteed", icon: CheckCircle,
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentySix
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Deep Cleaning", description: "Full scrub and sanitize of every room.", buttonIcon: Sparkles,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-people-cleaning-office_23-2150454489.jpg", imageAlt: "Full shot people cleaning office"},
|
|
{
|
|
title: "Regular Maintenance", description: "Weekly or bi-weekly upkeep for a pristine home.", buttonIcon: CheckCircle,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/closeup-hand-glove-cleaning-table-with-foam-detergent_1098-19033.jpg?_wi=2", imageAlt: "Full shot people cleaning office"},
|
|
{
|
|
title: "Move-In Cleaning", description: "Perfect for new beginnings and transitions.", buttonIcon: Shield,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-cleaning-indoors_23-2150454484.jpg?_wi=1", imageAlt: "Full shot people cleaning office"},
|
|
{
|
|
title: "Eco-Friendly Cleaning", description: "Safe, non-toxic products for your peace of mind.", buttonIcon: Zap,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-carefree-brunette-woman-sitting-couch-living-room-online-shopping_1258-201984.jpg?_wi=1", imageAlt: "Full shot people cleaning office"},
|
|
]}
|
|
title="Our Cleaning Services"
|
|
description="From deep cleans to regular maintenance, we ensure every corner is treated with care and precision."
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MediaAbout
|
|
useInvertedBackground={true}
|
|
title="Why Clarissa's Magic Touch?"
|
|
description="With years of experience, we provide more than just cleaning—we provide comfort, reliability, and magic in every sweep. We are fully insured and dedicated to excellence."
|
|
imageSrc="http://img.b2bpic.net/free-photo/front-view-man-cleaning-indoors_23-2150454484.jpg?_wi=2"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardEight
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
plans={[
|
|
{
|
|
id: "basic", badge: "Essential", price: "$120", subtitle: "Perfect for studio apartments", buttons: [
|
|
{
|
|
text: "Select", href: "#contact"},
|
|
],
|
|
features: [
|
|
"Kitchen cleaning", "Bathroom sanitization", "Vacuuming"],
|
|
},
|
|
{
|
|
id: "pro", badge: "Family Favorite", price: "$250", subtitle: "Great for full houses", buttons: [
|
|
{
|
|
text: "Select", href: "#contact"},
|
|
],
|
|
features: [
|
|
"Everything in Basic", "Floor polishing", "Windows (inside)", "Detail dusting"],
|
|
},
|
|
{
|
|
id: "premium", badge: "Deep Clean", price: "$400", subtitle: "The magic experience", buttons: [
|
|
{
|
|
text: "Select", href: "#contact"},
|
|
],
|
|
features: [
|
|
"Everything in Pro", "Oven cleaning", "Inside fridge", "Deep wall cleaning"],
|
|
},
|
|
]}
|
|
title="Transparent Pricing"
|
|
description="Clear, affordable rates for premium service."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
testimonials={[
|
|
{
|
|
id: "1", title: "Amazing", quote: "My home has never looked this good!", name: "Sarah Miller", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-carefree-brunette-woman-sitting-couch-living-room-online-shopping_1258-201984.jpg?_wi=2"},
|
|
{
|
|
id: "2", title: "Highly Recommend", quote: "Professional, on time, and meticulous.", name: "James Bond", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/man-shirt-smiling-posing-kitchen_23-2148414940.jpg"},
|
|
{
|
|
id: "3", title: "Magic Touch", quote: "Clarissa is simply the best in town.", name: "Emily Stone", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/bohemian-man-with-his-arms-crossed_1368-3542.jpg"},
|
|
{
|
|
id: "4", title: "Great Value", quote: "Worth every penny for the quality.", name: "David Wilson", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/crazy-man-funny-expression_1194-3203.jpg"},
|
|
{
|
|
id: "5", title: "So Fresh!", quote: "Love coming home on cleaning day.", name: "Linda Gray", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-woman-with-friends_23-2149152887.jpg"},
|
|
]}
|
|
title="What Our Clients Say"
|
|
description="Join hundreds of happy families enjoying a cleaner home."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "f1", title: "Are you insured?", content: "Yes, we are fully licensed and insured."},
|
|
{
|
|
id: "f2", title: "Do you bring your own supplies?", content: "Yes, we provide all high-quality cleaning equipment and eco-friendly products."},
|
|
{
|
|
id: "f3", title: "How can I book?", content: "You can fill out our contact form, or give us a call directly."},
|
|
]}
|
|
title="Common Questions"
|
|
description="Need more info? We are here to help."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={true}
|
|
background={{
|
|
variant: "rotated-rays-static"}}
|
|
text="Ready to experience the magic? Contact us today to schedule your cleaning."
|
|
buttons={[
|
|
{
|
|
text: "Contact Us", href: "mailto:hello@clarissasmagictouch.com"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[
|
|
{
|
|
title: "Navigation", items: [
|
|
{
|
|
label: "Services", href: "#services"},
|
|
{
|
|
label: "Pricing", href: "#pricing"},
|
|
{
|
|
label: "Contact", href: "#contact"},
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "Privacy Policy", href: "#"},
|
|
{
|
|
label: "Terms of Service", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
logoText="Clarissa's Magic Touch"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |