Update src/app/page.tsx
This commit is contained in:
361
src/app/page.tsx
361
src/app/page.tsx
@@ -25,276 +25,109 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Jar Car Wash"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Jar Car Wash"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="Jar Car Wash"
|
||||
description="Professional care for your vehicle. We offer premium detailing, deep cleaning, and expert protection to keep your car looking brand new."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
slides={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-car-washing-service_23-2149212212.jpg",
|
||||
imageAlt: "Professional car wash service",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-washing-his-car-garage_1157-26070.jpg",
|
||||
imageAlt: "Hand car wash detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bright-blue-foam-dark-water_23-2147798313.jpg",
|
||||
imageAlt: "Car wash foam",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2388.jpg",
|
||||
imageAlt: "Car wash facility",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsomen-man-black-sweater-washing-his-car_1157-35954.jpg",
|
||||
imageAlt: "Car water cleaning",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22318.jpg",
|
||||
imageAlt: "Car wash station",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="Jar Car Wash"
|
||||
description="Professional care for your vehicle. We offer premium detailing, deep cleaning, and expert protection to keep your car looking brand new."
|
||||
buttons={[{ text: "Book Now", href: "#contact" }]}
|
||||
slides={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/beautiful-car-washing-service_23-2149212212.jpg", imageAlt: "professional car wash service" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/man-washing-his-car-garage_1157-26070.jpg", imageAlt: "hand car wash service" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/bright-blue-foam-dark-water_23-2147798313.jpg", imageAlt: "car wash foam cleaning" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2388.jpg", imageAlt: "modern car wash facility" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/handsomen-man-black-sweater-washing-his-car_1157-35954.jpg", imageAlt: "car wash water spray" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22318.jpg", imageAlt: "auto cleaning service shop" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Interior Deep Cleaning",
|
||||
author: "Expert Care",
|
||||
description: "Vacuuming, steam cleaning, and leather conditioning for a refreshed cabin.",
|
||||
tags: [
|
||||
"Interior",
|
||||
"Detailing",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2795.jpg",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Exterior Foam Wash",
|
||||
author: "High Gloss",
|
||||
description: "Full hand wash using premium foam, wax, and drying for a brilliant shine.",
|
||||
tags: [
|
||||
"Exterior",
|
||||
"Hand Wash",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-polishing-car-with-orbital-applicator_1303-30574.jpg",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Paint Protection",
|
||||
author: "Long Lasting",
|
||||
description: "Professional polishing and wax application to keep your paint looking showroom new.",
|
||||
tags: [
|
||||
"Protection",
|
||||
"Wax",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22306.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Premium Services"
|
||||
description="We use eco-friendly products and professional techniques to ensure your vehicle gets the best possible care."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "s1", title: "Interior Deep Cleaning", author: "Expert Care", description: "Vacuuming, steam cleaning, and leather conditioning for a refreshed cabin.", tags: ["Interior", "Detailing"], imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2795.jpg" },
|
||||
{ id: "s2", title: "Exterior Foam Wash", author: "High Gloss", description: "Full hand wash using premium foam, wax, and drying for a brilliant shine.", tags: ["Exterior", "Hand Wash"], imageSrc: "http://img.b2bpic.net/free-photo/man-polishing-car-with-orbital-applicator_1303-30574.jpg" },
|
||||
{ id: "s3", title: "Paint Protection", author: "Long Lasting", description: "Professional polishing and wax application to keep your paint looking showroom new.", tags: ["Protection", "Wax"], imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22306.jpg" }
|
||||
]}
|
||||
title="Our Premium Services"
|
||||
description="We use eco-friendly products and professional techniques to ensure your vehicle gets the best possible care."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
badge: "Essential",
|
||||
price: "$25",
|
||||
subtitle: "Quick Refresh",
|
||||
features: [
|
||||
"Hand Wash",
|
||||
"Tire Shine",
|
||||
"Interior Vacuum",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
badge: "Premium",
|
||||
price: "$65",
|
||||
subtitle: "Deep Detail",
|
||||
features: [
|
||||
"Hand Wash",
|
||||
"Interior Deep Clean",
|
||||
"Glass Treatment",
|
||||
"Dashboard Polish",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "elite",
|
||||
badge: "Elite",
|
||||
price: "$120",
|
||||
subtitle: "Showroom Finish",
|
||||
features: [
|
||||
"Elite Detail",
|
||||
"Wax & Polish",
|
||||
"Engine Bay Clean",
|
||||
"Leather Conditioner",
|
||||
"Odor Removal",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Transparent Pricing"
|
||||
description="Choose the level of care your vehicle needs today."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{ id: "basic", badge: "Essential", price: "$25", subtitle: "Quick Refresh", features: ["Hand Wash", "Tire Shine", "Interior Vacuum"] },
|
||||
{ id: "pro", badge: "Premium", price: "$65", subtitle: "Deep Detail", features: ["Hand Wash", "Interior Deep Clean", "Glass Treatment", "Dashboard Polish"] },
|
||||
{ id: "elite", badge: "Elite", price: "$120", subtitle: "Showroom Finish", features: ["Elite Detail", "Wax & Polish", "Engine Bay Clean", "Leather Conditioner", "Odor Removal"] }
|
||||
]}
|
||||
title="Transparent Pricing"
|
||||
description="Choose the level of care your vehicle needs today."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={false}
|
||||
testimonial="I have never seen my car shine like this. Jar Car Wash team is extremely professional and detail-oriented. Worth every penny!"
|
||||
rating={5}
|
||||
author="Marcus Thompson"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiley-woman-cleaning-her-car-outside_23-2148958791.jpg",
|
||||
alt: "Marcus Thompson",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/professional-washer-blue-uniform-washing-luxury-car-with-water-gun-open-air-car-wash_496169-311.jpg",
|
||||
alt: "Anna Jenkins",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-customer-posing-car-dealership_651396-1155.jpg",
|
||||
alt: "Sarah Kline",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-taking-care-her-modern-car_23-2148510637.jpg",
|
||||
alt: "James Peterson",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/people-spending-time-gas-station_23-2150440198.jpg",
|
||||
alt: "Lucy Miller",
|
||||
},
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={false}
|
||||
testimonial="I have never seen my car shine like this. Jar Car Wash team is extremely professional and detail-oriented. Worth every penny!"
|
||||
rating={5}
|
||||
author="Marcus Thompson"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/smiley-woman-cleaning-her-car-outside_23-2148958791.jpg", alt: "happy customer car wash" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/professional-washer-blue-uniform-washing-luxury-car-with-water-gun-open-air-car-wash_496169-311.jpg", alt: "smiling customer car wash" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/happy-customer-posing-car-dealership_651396-1155.jpg", alt: "professional client car service" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-taking-care-her-modern-car_23-2148510637.jpg", alt: "driver after car wash" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/people-spending-time-gas-station_23-2150440198.jpg", alt: "happy car wash client" }
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Ready to Book?"
|
||||
description="Contact us today to schedule your wash and detailing service."
|
||||
inputs={[
|
||||
{
|
||||
name: "fullName",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "service",
|
||||
type: "text",
|
||||
placeholder: "Preferred Service",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Additional requests?",
|
||||
rows: 4,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abandoned-house-with-metallic-doors_23-2149454806.jpg"
|
||||
imageAlt="Jar Car Wash Facility"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Ready to Book?"
|
||||
description="Contact us today to schedule your wash and detailing service."
|
||||
inputs={[
|
||||
{ name: "fullName", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||
{ name: "service", type: "text", placeholder: "Preferred Service", required: true }
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Additional requests?", rows: 4 }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abandoned-house-with-metallic-doors_23-2149454806.jpg"
|
||||
imageAlt="Jar Car Wash Facility"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Jar Car Wash"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Jar Car Wash"
|
||||
columns={[
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Services", href: "#services" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "FAQ", href: "#" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user