Merge version_1 into main #1
259
src/app/page.tsx
259
src/app/page.tsx
@@ -33,26 +33,14 @@ export default function LandingPage() {
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Inventory",
|
||||
id: "inventory",
|
||||
},
|
||||
name: "Inventory", id: "inventory"},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
button={{
|
||||
text: "Test Drive",
|
||||
href: "#contact",
|
||||
}}
|
||||
brandName="MOTION"
|
||||
/>
|
||||
</div>
|
||||
@@ -60,42 +48,21 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
title="Drive the Extraordinary"
|
||||
description="Premium vehicles. Exceptional service. Your next chapter starts here."
|
||||
tag="Motion Car Sales"
|
||||
buttons={[
|
||||
{
|
||||
text: "View Our Inventory",
|
||||
href: "#inventory",
|
||||
},
|
||||
text: "View Our Inventory", href: "#inventory"},
|
||||
{
|
||||
text: "Book a Test Drive",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Book a Test Drive", href: "#contact"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-car-garage_417767-26.jpg",
|
||||
imageAlt: "Luxury car in showroom",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-car-garage_417767-26.jpg", imageAlt: "Luxury car in showroom"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ramp-building_23-2149397554.jpg",
|
||||
imageAlt: "Luxury car details",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/headlights-hood-black-luxury-car_146671-19732.jpg",
|
||||
imageAlt: "The headlights and the hood of a black luxury car.",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/breathtaking-view-lightened-tunnel-road_181624-17780.jpg",
|
||||
imageAlt: "Breathtaking view of lightened tunnel road",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dark-vip-cinema-studio-still-life_23-2149500613.jpg",
|
||||
imageAlt: "Dark vip cinema studio still life",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ramp-building_23-2149397554.jpg", imageAlt: "Luxury car details"}
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
rating={5}
|
||||
@@ -110,33 +77,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "500+",
|
||||
title: "Vehicles Sold",
|
||||
description: "Happy clients across the region.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-car-looking-into-car-mirror_1303-17040.jpg",
|
||||
},
|
||||
id: "1", value: "500+", title: "Vehicles Sold", description: "Happy clients across the region.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-car-looking-into-car-mirror_1303-17040.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
value: "4.9★",
|
||||
title: "Customer Rating",
|
||||
description: "Based on verified reviews.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-using-laptop-while-charging-electric-car_107420-94885.jpg",
|
||||
},
|
||||
id: "2", value: "4.9★", title: "Customer Rating", description: "Based on verified reviews.", imageSrc: "http://img.b2bpic.net/free-photo/man-using-laptop-while-charging-electric-car_107420-94885.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
value: "Easy",
|
||||
title: "Finance Options",
|
||||
description: "Tailored to your life.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shiny-lamp-bumper-old-headlight_1203-4248.jpg",
|
||||
},
|
||||
id: "3", value: "Easy", title: "Finance Options", description: "Tailored to your life.", imageSrc: "http://img.b2bpic.net/free-photo/shiny-lamp-bumper-old-headlight_1203-4248.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
value: "7-Day",
|
||||
title: "Return Guarantee",
|
||||
description: "Peace of mind included.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sensual-biker-girl-wearing-motorcycle-gear-sitting-floor-with-car-wheels-studio_613910-20212.jpg",
|
||||
},
|
||||
id: "4", value: "7-Day", title: "Return Guarantee", description: "Peace of mind included.", imageSrc: "http://img.b2bpic.net/free-photo/sensual-biker-girl-wearing-motorcycle-gear-sitting-floor-with-car-wheels-studio_613910-20212.jpg"},
|
||||
]}
|
||||
title="Our Reach"
|
||||
description="Results that speak for themselves."
|
||||
@@ -151,47 +98,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Executive Sedan",
|
||||
price: "$75,000",
|
||||
variant: "Sedan",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/back-view-grey-car-standing-bridge_114579-4084.jpg",
|
||||
},
|
||||
id: "1", name: "Executive Sedan", price: "$75,000", variant: "Sedan", imageSrc: "http://img.b2bpic.net/free-photo/back-view-grey-car-standing-bridge_114579-4084.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Performance Coupe",
|
||||
price: "$92,000",
|
||||
variant: "Performance",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-four-wheeled-vehicle-mobility-fast-travel_23-2151016453.jpg",
|
||||
},
|
||||
id: "2", name: "Performance Coupe", price: "$92,000", variant: "Performance", imageSrc: "http://img.b2bpic.net/free-photo/view-four-wheeled-vehicle-mobility-fast-travel_23-2151016453.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Luxury SUV",
|
||||
price: "$88,000",
|
||||
variant: "SUV",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-sexy-fashion-blond-girl-model-with-bright-makeup-curly-hairstyle-retro-style-sitting-old-car_158538-9243.jpg",
|
||||
},
|
||||
id: "3", name: "Luxury SUV", price: "$88,000", variant: "SUV", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-sexy-fashion-blond-girl-model-with-bright-makeup-curly-hairstyle-retro-style-sitting-old-car_158538-9243.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Electric GT",
|
||||
price: "$110,000",
|
||||
variant: "Electric",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/f1-racing-24-hours-le-mans-render-3d-illustration_654080-397.jpg",
|
||||
},
|
||||
id: "4", name: "Electric GT", price: "$110,000", variant: "Electric", imageSrc: "http://img.b2bpic.net/free-photo/f1-racing-24-hours-le-mans-render-3d-illustration_654080-397.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Premium Crossover",
|
||||
price: "$65,000",
|
||||
variant: "SUV",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-picture-part-grey-car_181624-33069.jpg",
|
||||
},
|
||||
id: "5", name: "Premium Crossover", price: "$65,000", variant: "SUV", imageSrc: "http://img.b2bpic.net/free-photo/vertical-picture-part-grey-car_181624-33069.jpg"},
|
||||
{
|
||||
id: "6",
|
||||
name: "Sports Roadster",
|
||||
price: "$98,000",
|
||||
variant: "Performance",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/superhero-car-vintage-style_23-2151636205.jpg",
|
||||
},
|
||||
id: "6", name: "Sports Roadster", price: "$98,000", variant: "Performance", imageSrc: "http://img.b2bpic.net/free-photo/superhero-car-vintage-style_23-2151636205.jpg"},
|
||||
]}
|
||||
title="Handpicked for You"
|
||||
description="Curated selection of premium vehicles."
|
||||
@@ -204,19 +121,13 @@ export default function LandingPage() {
|
||||
title="We Don't Just Sell Cars. We Match People to Their Journey."
|
||||
metrics={[
|
||||
{
|
||||
label: "Founded",
|
||||
value: "2015",
|
||||
icon: Calendar,
|
||||
label: "Founded", value: "2015", icon: Calendar,
|
||||
},
|
||||
{
|
||||
label: "Expertise",
|
||||
value: "Decades",
|
||||
icon: Award,
|
||||
label: "Expertise", value: "Decades", icon: Award,
|
||||
},
|
||||
{
|
||||
label: "Satisfaction",
|
||||
value: "100%",
|
||||
icon: ThumbsUp,
|
||||
label: "Satisfaction", value: "100%", icon: ThumbsUp,
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
@@ -230,26 +141,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Browse the Collection",
|
||||
subtitle: "Explore our curated premium inventory.",
|
||||
category: "Step 01",
|
||||
value: "Discover",
|
||||
},
|
||||
id: "s1", title: "Browse the Collection", subtitle: "Explore our curated premium inventory.", category: "Step 01", value: "Discover"},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Book a Test Drive",
|
||||
subtitle: "Schedule an appointment at your convenience.",
|
||||
category: "Step 02",
|
||||
value: "Experience",
|
||||
},
|
||||
id: "s2", title: "Book a Test Drive", subtitle: "Schedule an appointment at your convenience.", category: "Step 02", value: "Experience"},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Drive Away Happy",
|
||||
subtitle: "Financed and delivered with zero pressure.",
|
||||
category: "Step 03",
|
||||
value: "Enjoy",
|
||||
},
|
||||
id: "s3", title: "Drive Away Happy", subtitle: "Financed and delivered with zero pressure.", category: "Step 03", value: "Enjoy"},
|
||||
]}
|
||||
title="How it Works"
|
||||
description="Simple steps to your new journey."
|
||||
@@ -261,42 +157,18 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
description="See why our customers love their experience."
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
handle: "Purchased Sedan",
|
||||
testimonial: "An incredible experience from start to finish.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-lady-black-jacket-posing-isolated-background-happy-cheerful-woman-dark-suit-laughing-looking-into-camera_197531-18513.jpg",
|
||||
},
|
||||
id: "1", name: "Sarah J.", handle: "Purchased Sedan", testimonial: "An incredible experience from start to finish.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-lady-black-jacket-posing-isolated-background-happy-cheerful-woman-dark-suit-laughing-looking-into-camera_197531-18513.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael C.",
|
||||
handle: "Purchased SUV",
|
||||
testimonial: "Unmatched service and attention to detail.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-with-short-hair-bright-lips-glasses-smiling-outside-trendy-lady-black-clothes-posing-stairs_197531-19325.jpg",
|
||||
},
|
||||
id: "2", name: "Michael C.", handle: "Purchased SUV", testimonial: "Unmatched service and attention to detail.", imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-with-short-hair-bright-lips-glasses-smiling-outside-trendy-lady-black-clothes-posing-stairs_197531-19325.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily R.",
|
||||
handle: "Purchased Coupe",
|
||||
testimonial: "I finally found the car of my dreams.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/successful-man-pointing-camera-with-finger_1262-3118.jpg",
|
||||
},
|
||||
id: "3", name: "Emily R.", handle: "Purchased Coupe", testimonial: "I finally found the car of my dreams.", imageSrc: "http://img.b2bpic.net/free-photo/successful-man-pointing-camera-with-finger_1262-3118.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "David K.",
|
||||
handle: "Purchased GT",
|
||||
testimonial: "Expertise and professionalism defined my visit.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-smiling-woman-dressed-black-sweater-posing_114579-81856.jpg",
|
||||
},
|
||||
id: "4", name: "David K.", handle: "Purchased GT", testimonial: "Expertise and professionalism defined my visit.", imageSrc: "http://img.b2bpic.net/free-photo/pretty-smiling-woman-dressed-black-sweater-posing_114579-81856.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Alex P.",
|
||||
handle: "Purchased SUV",
|
||||
testimonial: "No pressure, just premium quality.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-groom-looks-thoughtful-sitting-couch-cosy-dark-cafe_8353-8118.jpg",
|
||||
},
|
||||
id: "5", name: "Alex P.", handle: "Purchased SUV", testimonial: "No pressure, just premium quality.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-groom-looks-thoughtful-sitting-couch-cosy-dark-cafe_8353-8118.jpg"},
|
||||
]}
|
||||
title="What Our Drivers Say"
|
||||
/>
|
||||
@@ -309,34 +181,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "p1",
|
||||
badge: "Entry",
|
||||
price: "Custom",
|
||||
subtitle: "Basic term options",
|
||||
features: [
|
||||
"Competitive rates",
|
||||
"Low down payment",
|
||||
],
|
||||
id: "p1", badge: "Entry", price: "Custom", subtitle: "Basic term options", features: [
|
||||
"Competitive rates", "Low down payment"],
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
badge: "Standard",
|
||||
price: "Tailored",
|
||||
subtitle: "Popular choice",
|
||||
features: [
|
||||
"Flexible terms",
|
||||
"Online approval",
|
||||
],
|
||||
id: "p2", badge: "Standard", price: "Tailored", subtitle: "Popular choice", features: [
|
||||
"Flexible terms", "Online approval"],
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
badge: "Premium",
|
||||
price: "Concierge",
|
||||
subtitle: "Full service",
|
||||
features: [
|
||||
"Custom financing",
|
||||
"Priority support",
|
||||
],
|
||||
id: "p3", badge: "Premium", price: "Concierge", subtitle: "Full service", features: [
|
||||
"Custom financing", "Priority support"],
|
||||
},
|
||||
]}
|
||||
title="Flexible Finance. Zero Hassle."
|
||||
@@ -351,25 +205,14 @@ export default function LandingPage() {
|
||||
description="Connect with our team today."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
},
|
||||
name: "name", type: "text", placeholder: "Your Name"},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
},
|
||||
name: "email", type: "email", placeholder: "Email Address"},
|
||||
{
|
||||
name: "phone",
|
||||
type: "tel",
|
||||
placeholder: "Phone Number",
|
||||
},
|
||||
name: "phone", type: "tel", placeholder: "Phone Number"},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "How can we help?",
|
||||
}}
|
||||
name: "message", placeholder: "How can we help?"}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-15970.jpg"
|
||||
/>
|
||||
</div>
|
||||
@@ -380,29 +223,19 @@ export default function LandingPage() {
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Inventory",
|
||||
href: "#inventory",
|
||||
},
|
||||
label: "Inventory", href: "#inventory"},
|
||||
{
|
||||
label: "Finance",
|
||||
href: "#finance",
|
||||
},
|
||||
label: "Finance", href: "#finance"},
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
label: "About", href: "#about"},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact", href: "#contact"},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user