Merge version_1 into main #2
356
src/app/page.tsx
356
src/app/page.tsx
@@ -28,253 +28,131 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Results",
|
||||
id: "gallery",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Plainfield Auto Spa"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Results", id: "gallery" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Plainfield Auto Spa"
|
||||
button={{ text: "Get a Quote", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
logoText="Plainfield Auto Spa & Detailing"
|
||||
description="Make Your Car Look Brand New Again. Professional Auto Detailing in Grand Rapids – 5-Star Rated."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:6162027826",
|
||||
},
|
||||
{
|
||||
text: "Get a Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="Luxury car detailing shine"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "plain" }}
|
||||
logoText="Plainfield Auto Spa & Detailing"
|
||||
description="Make Your Car Look Brand New Again. Professional Auto Detailing in Grand Rapids – 5-Star Rated."
|
||||
buttons={[
|
||||
{ text: "Call Now", href: "tel:6162027826" },
|
||||
{ text: "Get a Quote", href: "#contact" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="Luxury car detailing shine"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"4.9 Rating",
|
||||
"30+ Reviews",
|
||||
"Top Local Service",
|
||||
"Grand Rapids Best",
|
||||
]}
|
||||
title="Trusted by 500+ Happy Drivers"
|
||||
description="Our customers love the transformation."
|
||||
tag="Reliability"
|
||||
/>
|
||||
</div>
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={["4.9 Rating", "30+ Reviews", "Top Local Service", "Grand Rapids Best"]}
|
||||
title="Trusted by 500+ Happy Drivers"
|
||||
description="Our customers love the transformation."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardEight
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "Interior Detailing",
|
||||
description: "Deep cleaning of seats, carpets, and dashboards.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-seat-car-with-seat-belt_181624-26340.jpg",
|
||||
imageAlt: "Car interior deep clean",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Exterior Detailing",
|
||||
description: "Hand wash, clay bar, and protective wax.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-spraying-powder-paint-vehicle_23-2149878799.jpg",
|
||||
imageAlt: "Car exterior wash foam",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Full Detail Packages",
|
||||
description: "Complete bumper-to-bumper deep cleaning.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/neon-modern-car-wash-company-services-flyer-template_742173-18781.jpg",
|
||||
imageAlt: "Car wash bundle detailing",
|
||||
},
|
||||
]}
|
||||
title="Our Professional Services"
|
||||
description="We offer specialized care to get your vehicle looking its best."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardEight
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: 1, title: "Interior Detailing", description: "Deep cleaning of seats, carpets, and dashboards.", imageSrc: "http://img.b2bpic.net/free-photo/front-seat-car-with-seat-belt_181624-26340.jpg", imageAlt: "Car interior deep clean" },
|
||||
{ id: 2, title: "Exterior Detailing", description: "Hand wash, clay bar, and protective wax.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-spraying-powder-paint-vehicle_23-2149878799.jpg", imageAlt: "Car exterior wash foam" },
|
||||
{ id: 3, title: "Full Detail Packages", description: "Complete bumper-to-bumper deep cleaning.", imageSrc: "http://img.b2bpic.net/free-vector/neon-modern-car-wash-company-services-flyer-template_742173-18781.jpg", imageAlt: "Car wash bundle detailing" },
|
||||
]}
|
||||
title="Our Professional Services"
|
||||
description="We offer specialized care to get your vehicle looking its best."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery" data-section="gallery">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Result",
|
||||
name: "Interior Restoration",
|
||||
price: "Before/After",
|
||||
rating: 5,
|
||||
reviewCount: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/luggage-seen-from-rear-car-window_23-2150934351.jpg",
|
||||
imageAlt: "Car upholstery before and after",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Result",
|
||||
name: "Paint Polish",
|
||||
price: "Before/After",
|
||||
rating: 5,
|
||||
reviewCount: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/service-worker-painting-car-auto-service_23-2149487003.jpg",
|
||||
imageAlt: "Car paint restoration before after",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Result",
|
||||
name: "Full Finish",
|
||||
price: "Before/After",
|
||||
rating: 5,
|
||||
reviewCount: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg?_wi=2",
|
||||
imageAlt: "Car finish result",
|
||||
},
|
||||
]}
|
||||
title="See the Difference"
|
||||
description="Real transformations from our local shop."
|
||||
/>
|
||||
</div>
|
||||
<div id="gallery" data-section="gallery">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", brand: "Result", name: "Interior Restoration", price: "Before/After", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/luggage-seen-from-rear-car-window_23-2150934351.jpg", imageAlt: "Car upholstery before and after" },
|
||||
{ id: "2", brand: "Result", name: "Paint Polish", price: "Before/After", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/service-worker-painting-car-auto-service_23-2149487003.jpg", imageAlt: "Car paint restoration before after" },
|
||||
{ id: "3", brand: "Result", name: "Full Finish", price: "Before/After", rating: 5, reviewCount: "1", imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg", imageAlt: "Car finish result" },
|
||||
]}
|
||||
title="See the Difference"
|
||||
description="Real transformations from our local shop."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="why-choose-us" data-section="why-choose-us">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Expertise"
|
||||
title="Why Choose Plainfield Auto Spa?"
|
||||
description="We are a locally-owned business dedicated to quality and customer service."
|
||||
subdescription="With over 5 years of experience in Grand Rapids, we ensure every car leaves looking like it just came off the showroom floor."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/repairing-tools_1417-1788.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
icon={Award}
|
||||
imageAlt="Professional auto spa tools"
|
||||
/>
|
||||
</div>
|
||||
<div id="why-choose-us" data-section="why-choose-us">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Expertise"
|
||||
title="Why Choose Plainfield Auto Spa?"
|
||||
description="We are a locally-owned business dedicated to quality and customer service."
|
||||
subdescription="With over 5 years of experience in Grand Rapids, we ensure every car leaves looking like it just came off the showroom floor."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/repairing-tools_1417-1788.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
icon={Award}
|
||||
imageAlt="Professional auto spa tools"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
role: "Local Customer",
|
||||
company: "Grand Rapids",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg?_wi=3",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael R.",
|
||||
role: "Busy Professional",
|
||||
company: "Grand Rapids",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg?_wi=4",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily P.",
|
||||
role: "Car Enthusiast",
|
||||
company: "Grand Rapids",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg?_wi=5",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David L.",
|
||||
role: "Local Customer",
|
||||
company: "Grand Rapids",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg?_wi=6",
|
||||
},
|
||||
]}
|
||||
title="Client Reviews"
|
||||
description="See why our Grand Rapids community trusts us."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah J.", role: "Local Customer", company: "Grand Rapids", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg" },
|
||||
{ id: "2", name: "Michael R.", role: "Busy Professional", company: "Grand Rapids", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg" },
|
||||
{ id: "3", name: "Emily P.", role: "Car Enthusiast", company: "Grand Rapids", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg" },
|
||||
{ id: "4", name: "David L.", role: "Local Customer", company: "Grand Rapids", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expensive-car-unrecognizable-customers_651396-1143.jpg" },
|
||||
]}
|
||||
title="Client Reviews"
|
||||
description="See why our Grand Rapids community trusts us."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Ready to Transform Your Car?"
|
||||
description="Call us today at (616) 202-7826 or fill out the form below."
|
||||
tag="Book Now"
|
||||
tagIcon={Phone}
|
||||
inputPlaceholder="Enter your email or phone number"
|
||||
buttonText="Request a Quote"
|
||||
termsText="By submitting this form, you agree to our privacy policy and service terms."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
title="Ready to Transform Your Car?"
|
||||
description="Call us today at (616) 202-7826 or fill out the form below."
|
||||
tag="Book Now"
|
||||
tagIcon={Phone}
|
||||
buttonText="Request a Quote"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Plainfield Auto Spa"
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Interior Detail",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Exterior Detail",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#why-choose-us",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Plainfield Auto Spa. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Plainfield Auto Spa"
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [{ label: "Interior Detail", href: "#services" }, { label: "Exterior Detail", href: "#services" }],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [{ label: "About Us", href: "#why-choose-us" }, { label: "Contact", href: "#contact" }],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Plainfield Auto Spa. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user