Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 9b7d8d8993 | |||
| b80837eb4f |
221
src/app/page.tsx
221
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 FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import MediaAbout from '@/components/sections/about/MediaAbout';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
||||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import { Star, ShieldCheck, Zap } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -23,194 +24,118 @@ export default function LandingPage() {
|
||||
cardStyle="outline"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="normal"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Benefits",
|
||||
id: "benefits",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Benefits", id: "benefits" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="ClearView Restore"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "canvas-reveal",
|
||||
}}
|
||||
<HeroSplitDualMedia
|
||||
title="Bring Your Headlights Back to Life"
|
||||
description="Don't settle for dim, yellowed headlights. Our professional restoration service restores clarity, brightness, and safety for any vehicle model."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193582.jpg"
|
||||
imageAlt="Headlight restoration before and after"
|
||||
description="Professional-grade restoration for superior clarity and nighttime visibility. Don't let yellowed, oxidized lenses dim your driving experience—restore your vehicle's safety and style."
|
||||
tag="Professional Restoration"
|
||||
rating={5}
|
||||
ratingText="5-star rated service"
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193582.jpg", imageAlt: "Headlight restoration" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/led-headlight-blue-car_23-2147962992.jpg", imageAlt: "Clear headlights" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
<SplitAbout
|
||||
title="Engineered for Clarity"
|
||||
description="We combine advanced chemical processes with precise mechanical polishing to remove oxidation and yellowing. Our durable clear-coat protection ensures your headlights stay bright and safe for years."
|
||||
tag="Our Process"
|
||||
useInvertedBackground={true}
|
||||
title="Restoration You Can Trust"
|
||||
description="We specialize in restoring cloudy, oxidized headlights to factory clarity. Our multi-step process uses specialized abrasives and protective coatings to ensure your headlights stay clear for years to come. Safety is our priority."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/led-headlight-blue-car_23-2147962992.jpg"
|
||||
imageAlt="Professional headlight restoration"
|
||||
textboxLayout="split"
|
||||
bulletPoints={[
|
||||
{ title: "Deep Oxidation Removal", description: "Advanced sanding techniques reach even the worst degradation.", icon: ShieldCheck },
|
||||
{ title: "UV Protection", description: "High-grade ceramic coating prevents future yellowing.", icon: Zap },
|
||||
{ title: "Factory Clarity", description: "Restore original light output to factory standards.", icon: Star },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/head-lights-car_1339-1874.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="benefits" data-section="benefits">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
<FeatureCardNineteen
|
||||
title="Why Choose ClearView?"
|
||||
description="Expert care for your vehicle's most important visibility component."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1",
|
||||
label: "Safety",
|
||||
title: "Enhanced Visibility",
|
||||
items: [
|
||||
"Brighter nighttime driving",
|
||||
"Better beam distance",
|
||||
"Improved road safety",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
label: "Value",
|
||||
title: "Increased Resale Value",
|
||||
items: [
|
||||
"Better first impressions",
|
||||
"Looks brand new",
|
||||
"Higher trade-in appeal",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
label: "Savings",
|
||||
title: "Cost Effective",
|
||||
items: [
|
||||
"Fraction of replacement cost",
|
||||
"Fast turnaround",
|
||||
"Professional results",
|
||||
],
|
||||
},
|
||||
{ tag: "Performance", title: "Nighttime Visibility", subtitle: "Drive with confidence", description: "See further and react faster with fully transparent lenses.", imageSrc: "http://img.b2bpic.net/free-photo/headlight-lamp_74190-5517.jpg" },
|
||||
{ tag: "Economics", title: "Cost Savings", subtitle: "Avoid expensive replacements", description: "Restoring is a fraction of the cost of buying new assembly units.", imageSrc: "http://img.b2bpic.net/free-photo/man-working-as-truck-driver_23-2151489876.jpg" }
|
||||
]}
|
||||
title="Why Choose Our Service?"
|
||||
description="Experience the difference of clear optics."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
<TestimonialCardThirteen
|
||||
title="Loved by Drivers Everywhere"
|
||||
description="Real results from satisfied customers across the country."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
showRating={true}
|
||||
animationType="depth-3d"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Mark Stevens",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-working-as-truck-driver_23-2151489876.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Elena Rodriguez",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-polishing-his-car-with-rag_1303-21780.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Jason Miller",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-mechanic-with-arms-crossed-spanner_1170-1437.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sarah Jenkins",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/head-lights-car_1339-1874.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "David Thorne",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-young-man-looking-camera-sitting-car-view-from-rear-seat_231208-863.jpg",
|
||||
},
|
||||
{ id: "1", name: "Alex Rivera", handle: "@driver_lex", testimonial: "Unbelievable transformation! My car looks years younger.", rating: 5 },
|
||||
{ id: "2", name: "Jordan P.", handle: "@jp_auto", testimonial: "Finally passed inspection. Saved me hundreds on new lenses.", rating: 5 },
|
||||
{ id: "3", name: "Sarah K.", handle: "@sara_k", testimonial: "Fast, professional, and genuinely clear results.", rating: 5 },
|
||||
]}
|
||||
cardTitle="Client Success Stories"
|
||||
cardTag="What they say"
|
||||
cardAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
<FaqSplitText
|
||||
sideTitle="Need Answers?"
|
||||
sideDescription="We've answered the most common questions about our professional headlight restoration process."
|
||||
useInvertedBackground={false}
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How long does restoration last?",
|
||||
content: "Our protective coating usually lasts between 12-24 months depending on climate.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Does it work on any headlight?",
|
||||
content: "Yes, our process is effective on all polycarbonate headlight lenses.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "How long does the service take?",
|
||||
content: "Typically 60-90 minutes depending on the level of oxidation.",
|
||||
},
|
||||
{ id: "1", title: "How long will it last?", content: "Our UV-resistant sealing process ensures lasting clarity, typically 1-2 years based on environmental exposure." },
|
||||
{ id: "2", title: "Does it work on all cars?", content: "Our restoration method is universally compatible with all plastic/polycarbonate lenses." },
|
||||
{ id: "3", title: "How long is the process?", content: "The procedure typically takes about 60-90 minutes at our facility." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/headlight-lamp_74190-5517.jpg"
|
||||
imageAlt="Clean headlights at night"
|
||||
mediaAnimation="slide-up"
|
||||
title="Frequently Asked Questions"
|
||||
description="Have questions about our service? Here's what you need to know."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
<ContactSplitForm
|
||||
title="Get Your Headlights Restored"
|
||||
description="Book an appointment and reclaim your night visibility today. Simply fill out the form below and we will contact you to schedule your service."
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "rotated-rays-static-grid",
|
||||
}}
|
||||
text="Ready to see clearly again? Book your restoration today and experience the difference."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#",
|
||||
},
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Full Name" },
|
||||
{ name: "email", type: "email", placeholder: "Email Address" },
|
||||
{ name: "phone", type: "tel", placeholder: "Phone Number" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-man-polishing-his-car-with-rag_1303-21780.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="ClearView"
|
||||
leftLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
<FooterBaseCard
|
||||
logoText="ClearView Restore"
|
||||
columns={[
|
||||
{ title: "Services", items: [{ label: "Headlight Restoration", href: "#" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Contact", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user