Compare commits
19 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| d7fa6efbf3 | |||
| 6a4ccce041 | |||
| b4d8e85c97 | |||
| c607bedbd4 | |||
| 53494c3b95 | |||
| 8169f88481 | |||
| cfb507e963 | |||
| dbe696d3cc | |||
| 950f3304e9 | |||
| b660c8095d | |||
| 85ef1d1142 | |||
| 556ca8bd08 | |||
| f69b035b22 | |||
| 11969ae3dc | |||
| 9cf1622f3f | |||
| 8c522a1fb3 | |||
| 83247a48e0 | |||
| ec081982d6 | |||
| e84dd9a7cb |
327
src/app/page.tsx
327
src/app/page.tsx
@@ -2,14 +2,15 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
|
||||
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import { ShieldCheck, Sparkles, Zap, Wrench } from "lucide-react";
|
||||
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
||||
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -26,217 +27,119 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Elite Detailers"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Elite Detailers"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboardSplit
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
logoText="Premium Car Wash & Detailing"
|
||||
description="Providing exceptional auto care in Medley for over 20 years. Veteran-owned business dedicated to perfection."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
layoutOrder="default"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
title="Premium Auto Detailing"
|
||||
description="Over 20 years of experience serving the Medley community with veteran-owned perfection."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
buttons={[{ text: "Book Your Service", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg?_wi=1", imageAlt: "Detailing process" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={true}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "Over 20 Years of ",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193144.jpg",
|
||||
alt: "Service",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
content: " Excellence",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
tag="20+ Years Experience"
|
||||
title="Veteran-Owned Excellence"
|
||||
description="We specialize in precision care for your vehicle, offering everything from engine bay degreasing to luxury ceramic coatings."
|
||||
subdescription="Ask us about our special military discounts for active duty and veterans."
|
||||
icon={ShieldCheck}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193144.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Ceramic Coating",
|
||||
description: "Long-lasting protection and incredible shine.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-leaning-car-with-open-hood_23-2148257995.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Interior Detailing",
|
||||
description: "Deep cleaning for leather, fabric, and carpets.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/driver-gesture-rainy-drive-car-dashboard_169016-68038.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Engine Bay Cleaning",
|
||||
description: "Professional engine bay degreasing.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-car-service-station_23-2148327584.jpg",
|
||||
},
|
||||
]}
|
||||
title="Professional Services"
|
||||
description="Comprehensive detailing to restore and protect your investment."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
title="Our Premium Services"
|
||||
description="Complete interior and exterior solutions for your car's longevity and aesthetics."
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
features={[
|
||||
{ title: "Exterior & Interior", description: "Hand wash, interior deep cleaning, and vacuuming.", icon: Sparkles, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/driver-gesture-rainy-drive-car-dashboard_169016-68038.jpg" }] },
|
||||
{ title: "Ceramic & Waxing", description: "High-grade ceramic coating and premium hand wax.", icon: Zap, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193144.jpg?_wi=2" }, { imageSrc: "http://img.b2bpic.net/free-photo/man-leaning-car-with-open-hood_23-2148257995.jpg" }] },
|
||||
{ title: "Engine Detailing", description: "Professional engine bay cleaning and protection.", icon: Wrench, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-car-service-station_23-2148327584.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-car-service-station_23-2148327584.jpg?_wi=2" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "366+",
|
||||
title: "Verified Reviews",
|
||||
description: "5.0 star average rating",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-car-dealership_23-2148130220.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "20+",
|
||||
title: "Years Experience",
|
||||
description: "Serving the Medley area",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193144.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "24/7",
|
||||
title: "Availability",
|
||||
description: "Always ready to serve",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us"
|
||||
description="Trusted by hundreds of satisfied customers."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
title="Our Impact"
|
||||
description="Thousands of satisfied customers over two decades."
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "1", value: "20+", title: "Years", description: "Experience in business", icon: ShieldCheck },
|
||||
{ id: "2", value: "366+", title: "Reviews", description: "5-star average", icon: Sparkles },
|
||||
{ id: "3", value: "100%", title: "Satisfaction", description: "Guaranteed quality", icon: Zap }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
role: "Client",
|
||||
company: "Medley",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-car-dealership_23-2148130220.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark D.",
|
||||
role: "Client",
|
||||
company: "Medley",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-black-hat-standing-by-her-new-white-car_1303-28799.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena R.",
|
||||
role: "Client",
|
||||
company: "Medley",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-office-with-tablet_1098-2077.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "James K.",
|
||||
role: "Client",
|
||||
company: "Medley",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-talking-phone-medium-shot_23-2148320231.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Robert L.",
|
||||
role: "Client",
|
||||
company: "Medley",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-car-dealership_23-2148130220.jpg?_wi=3",
|
||||
},
|
||||
]}
|
||||
title="Customer Reviews"
|
||||
description="See why our customers trust us with their vehicles."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
title="What Our Customers Say"
|
||||
description="Hear from the people who trust us with their most valuable assets."
|
||||
useInvertedBackground={true}
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
kpiItems={[
|
||||
{ value: "5.0", label: "Star Rating" },
|
||||
{ value: "20+", label: "Years Local" },
|
||||
{ value: "10k+", label: "Vehicles Served" }
|
||||
]}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah J.", role: "Client", company: "Medley", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-man-car-dealership_23-2148130220.jpg?_wi=2" },
|
||||
{ id: "2", name: "Mark D.", role: "Client", company: "Medley", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-black-hat-standing-by-her-new-white-car_1303-28799.jpg" },
|
||||
{ id: "3", name: "Elena R.", role: "Client", company: "Medley", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-office-with-tablet_1098-2077.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "rotated-rays-animated",
|
||||
}}
|
||||
text="Ready for a professional car detailing? Get in touch today for a free quote."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us Now",
|
||||
href: "tel:8774343749",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
ctaTitle="Ready to get started?"
|
||||
ctaDescription="Schedule your service today. Proud to offer military discounts."
|
||||
ctaButton={{ text: "Get a Free Quote", href: "tel:8774343749" }}
|
||||
ctaIcon={Zap}
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
faqs={[
|
||||
{ id: "1", title: "Do you offer military discounts?", content: "Yes, we proudly offer special pricing for all active-duty military and veterans as a thank you for your service." },
|
||||
{ id: "2", title: "What services do you provide?", content: "We cover everything from basic exterior washes to full ceramic coating and deep interior detailing." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Elite Detailers"
|
||||
leftLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Services", items: [{ label: "Ceramic Coating", href: "#features" }, { label: "Detailing", href: "#features" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Reviews", href: "#testimonials" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user