Merge version_1 into main #2
217
src/app/page.tsx
217
src/app/page.tsx
@@ -18,27 +18,26 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
name: "Features", id: "features"},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
name: "FAQ", id: "faq"},
|
||||
]}
|
||||
brandName="AutoTrack"
|
||||
/>
|
||||
@@ -47,77 +46,48 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
title="Never Miss a Service Beat Again."
|
||||
description="AutoTrack takes the guesswork out of vehicle care. Monitor oil changes, fuel levels, and essential maintenance, all in one intuitive dashboard."
|
||||
kpis={[
|
||||
{
|
||||
value: "15k+",
|
||||
label: "Vehicles Tracked",
|
||||
},
|
||||
value: "15k+", label: "Vehicles Tracked"},
|
||||
{
|
||||
value: "98%",
|
||||
label: "Client Satisfaction",
|
||||
},
|
||||
value: "98%", label: "Client Satisfaction"},
|
||||
{
|
||||
value: "24/7",
|
||||
label: "Real-time Alerts",
|
||||
},
|
||||
value: "24/7", label: "Real-time Alerts"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#features",
|
||||
},
|
||||
text: "Get Started", href: "#features"},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8yw2kn&_wi=1"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8yw2kn"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=46yyvb",
|
||||
alt: "young woman smartphone portrait",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=46yyvb", alt: "young woman smartphone portrait"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rzfmtd",
|
||||
alt: "mechanic smiling portrait",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rzfmtd", alt: "mechanic smiling portrait"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=defjlb",
|
||||
alt: "man driving car smiling",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=defjlb", alt: "man driving car smiling"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=st090z",
|
||||
alt: "woman entrepreneur sitting in car",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=st090z", alt: "woman entrepreneur sitting in car"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z5lj6u",
|
||||
alt: "young student car owner",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z5lj6u", alt: "young student car owner"},
|
||||
]}
|
||||
avatarText="Trusted by 5,000+ drivers"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Oil Monitoring",
|
||||
},
|
||||
type: "text", text: "Oil Monitoring"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Fuel Stats",
|
||||
},
|
||||
type: "text", text: "Fuel Stats"},
|
||||
{
|
||||
type: "text",
|
||||
text: "GPS Tracking",
|
||||
},
|
||||
type: "text", text: "GPS Tracking"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Service Alerts",
|
||||
},
|
||||
type: "text", text: "Service Alerts"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Vehicle Health",
|
||||
},
|
||||
type: "text", text: "Vehicle Health"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -130,20 +100,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "5k",
|
||||
description: "Miles until next service",
|
||||
},
|
||||
id: "m1", value: "5k", description: "Miles until next service"},
|
||||
{
|
||||
id: "m2",
|
||||
value: "45%",
|
||||
description: "Remaining fuel capacity",
|
||||
},
|
||||
id: "m2", value: "45%", description: "Remaining fuel capacity"},
|
||||
{
|
||||
id: "m3",
|
||||
value: "12",
|
||||
description: "Active tracking alerts",
|
||||
},
|
||||
id: "m3", value: "12", description: "Active tracking alerts"},
|
||||
]}
|
||||
title="Stay Informed, Stay Safe"
|
||||
description="We make complex maintenance simple. Get clear insights into your vehicle's health."
|
||||
@@ -157,21 +118,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{
|
||||
items: [
|
||||
"No more forgotten services",
|
||||
"Stop manual tracking",
|
||||
"No more empty tanks",
|
||||
"Less downtime",
|
||||
"Fewer surprise repairs",
|
||||
],
|
||||
"No more forgotten services", "Stop manual tracking", "No more empty tanks", "Less downtime", "Fewer surprise repairs"],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Automated oil change alerts",
|
||||
"Fuel monitoring system",
|
||||
"GPS parking location tracker",
|
||||
"Predictive diagnostics",
|
||||
"Service history logs",
|
||||
],
|
||||
"Automated oil change alerts", "Fuel monitoring system", "GPS parking location tracker", "Predictive diagnostics", "Service history logs"],
|
||||
}}
|
||||
title="Maintenance Without the Stress"
|
||||
description="Features designed to keep your car performing at its peak."
|
||||
@@ -184,60 +135,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
date: "Jan 2025",
|
||||
title: "Great App",
|
||||
quote: "I never have to worry about my oil changes anymore. Everything is automated!",
|
||||
tag: "Trusted",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=46yyvb",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8yw2kn&_wi=2",
|
||||
imageAlt: "young woman smartphone portrait",
|
||||
},
|
||||
id: "t1", name: "Sarah J.", date: "Jan 2025", title: "Great App", quote: "I never have to worry about my oil changes anymore. Everything is automated!", tag: "Trusted", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=46yyvb", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8yw2kn", imageAlt: "young woman smartphone portrait"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mark D.",
|
||||
date: "Dec 2024",
|
||||
title: "Lifesaver",
|
||||
quote: "The parking locator is a game changer for me. Simple and effective.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rzfmtd",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=k6ziex",
|
||||
imageAlt: "young woman smartphone portrait",
|
||||
},
|
||||
id: "t2", name: "Mark D.", date: "Dec 2024", title: "Lifesaver", quote: "The parking locator is a game changer for me. Simple and effective.", tag: "Verified", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=rzfmtd", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=k6ziex", imageAlt: "young woman smartphone portrait"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Elena R.",
|
||||
date: "Nov 2024",
|
||||
title: "Highly Recommend",
|
||||
quote: "User-friendly interface that just works. Keeps my car in top shape.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=defjlb",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=s27ba7",
|
||||
imageAlt: "young woman smartphone portrait",
|
||||
},
|
||||
id: "t3", name: "Elena R.", date: "Nov 2024", title: "Highly Recommend", quote: "User-friendly interface that just works. Keeps my car in top shape.", tag: "Verified", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=defjlb", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=s27ba7", imageAlt: "young woman smartphone portrait"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David W.",
|
||||
date: "Oct 2024",
|
||||
title: "Fantastic",
|
||||
quote: "I wish I had this years ago. Saves me so much time and money.",
|
||||
tag: "Trusted",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=st090z",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wax06v",
|
||||
imageAlt: "young woman smartphone portrait",
|
||||
},
|
||||
id: "t4", name: "David W.", date: "Oct 2024", title: "Fantastic", quote: "I wish I had this years ago. Saves me so much time and money.", tag: "Trusted", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=st090z", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wax06v", imageAlt: "young woman smartphone portrait"},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Emily K.",
|
||||
date: "Sep 2024",
|
||||
title: "Must have",
|
||||
quote: "The alerts are always timely. I feel much safer on the road.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z5lj6u",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3gepkr",
|
||||
imageAlt: "young woman smartphone portrait",
|
||||
},
|
||||
id: "t5", name: "Emily K.", date: "Sep 2024", title: "Must have", quote: "The alerts are always timely. I feel much safer on the road.", tag: "Verified", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z5lj6u", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3gepkr", imageAlt: "young woman smartphone portrait"},
|
||||
]}
|
||||
title="Loved by Drivers Everywhere"
|
||||
description="Hear what our community says about keeping their cars healthy with AutoTrack."
|
||||
@@ -249,20 +155,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How does AutoTrack track my car data?",
|
||||
content: "Our app connects with industry-standard sensors and historical maintenance data to predict service intervals.",
|
||||
},
|
||||
id: "q1", title: "How does AutoTrack track my car data?", content: "Our app connects with industry-standard sensors and historical maintenance data to predict service intervals."},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Is my location data secure?",
|
||||
content: "Yes, we use advanced encryption to ensure your parking location and driving patterns remain private.",
|
||||
},
|
||||
id: "q2", title: "Is my location data secure?", content: "Yes, we use advanced encryption to ensure your parking location and driving patterns remain private."},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Do I need special hardware?",
|
||||
content: "No, AutoTrack works entirely via our mobile interface using your driving behavior and vehicle model data.",
|
||||
},
|
||||
id: "q3", title: "Do I need special hardware?", content: "No, AutoTrack works entirely via our mobile interface using your driving behavior and vehicle model data."},
|
||||
]}
|
||||
sideTitle="Questions? We've Got Answers."
|
||||
sideDescription="Check out our FAQs to understand how we can help you keep your vehicle on the road."
|
||||
@@ -275,14 +172,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"AutoTech Labs",
|
||||
"SpeedService Pro",
|
||||
"Innovation Motor",
|
||||
"Global Auto Insights",
|
||||
"DriveSoft Solutions",
|
||||
"Future Mobility Corp",
|
||||
"Performance Metrics Inc",
|
||||
]}
|
||||
"AutoTech Labs", "SpeedService Pro", "Innovation Motor", "Global Auto Insights", "DriveSoft Solutions", "Future Mobility Corp", "Performance Metrics Inc"]}
|
||||
title="Trusted Industry Leaders"
|
||||
description="We are proud to be recognized by leaders in the automotive technology sector."
|
||||
/>
|
||||
@@ -292,8 +182,7 @@ export default function LandingPage() {
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
tag="Join Now"
|
||||
title="Get Started Today"
|
||||
description="Ready to take control of your vehicle maintenance? Sign up now for free access."
|
||||
@@ -308,29 +197,19 @@ export default function LandingPage() {
|
||||
logoText="AutoTrack"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
title: "Navigation", items: [
|
||||
{
|
||||
label: "Features",
|
||||
href: "#features",
|
||||
},
|
||||
label: "Features", href: "#features"},
|
||||
{
|
||||
label: "Testimonials",
|
||||
href: "#testimonials",
|
||||
},
|
||||
label: "Testimonials", href: "#testimonials"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Help Center",
|
||||
href: "#faq",
|
||||
},
|
||||
label: "Help Center", href: "#faq"},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user