Merge version_1_1777026245168 into main #2

Merged
bender merged 2 commits from version_1_1777026245168 into main 2026-04-24 11:03:42 +00:00
2 changed files with 376 additions and 386 deletions

View File

@@ -1,372 +1,10 @@
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSimple from '@/components/sections/faq/FaqSimple';
import FeaturesDetailedCards from '@/components/sections/features/FeaturesDetailedCards';
import FooterBasic from '@/components/sections/footer/FooterBasic';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
import NavbarCentered from '@/components/ui/NavbarCentered';
import ProductRatingCards from '@/components/sections/product/ProductRatingCards';
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
import TestimonialDetailedCards from '@/components/sections/testimonial/TestimonialDetailedCards';
import { Routes, Route } from 'react-router-dom';
import HomePage from './pages/HomePage';
export default function App() {
return (
<>
<div id="nav" data-section="nav">
<NavbarCentered
logo="ApexMotors"
navItems={[
{
name: "Vehicles",
href: "#products",
},
{
name: "Why Us",
href: "#features",
},
{
name: "Reviews",
href: "#testimonials",
},
{
name: "FAQ",
href: "#faq",
},
]}
ctaButton={{
text: "Contact Sales",
href: "#contact",
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroOverlayTestimonial
tag="Luxury. Quality. Integrity."
title="Drive Your Dream Car Home"
description="Experience excellence in automotive sales with ApexMotors. Discover a refined collection of premium, quality-checked vehicles designed to elevate your journey."
primaryButton={{
text: "Browse Inventory",
href: "#products",
}}
secondaryButton={{
text: "Contact Us",
href: "#contact",
}}
testimonials={[
{
name: "Sarah J.",
handle: "@sarahj",
text: "The smoothest car buying experience ever. Highly recommended!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-happy-customer-car-dealership_23-2149117173.jpg",
},
{
name: "Michael B.",
handle: "@mikeb",
text: "Quality vehicles and transparent pricing. Couldn't ask for more.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-girl-holding-car-keys_23-2148333008.jpg",
},
{
name: "Elena R.",
handle: "@elenar",
text: "Found my perfect ride in record time. Excellent service.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-brunette-man-eyeglasses-smiles-widely-outside-happy-guy-black-jacket-white-tshirt-poses-near-airport_197531-27123.jpg",
},
{
name: "David L.",
handle: "@davidl",
text: "Professional team and impeccable inventory quality.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-young-woman-giving-thumbs-up-standing-isolated-rosy_176532-7958.jpg",
},
{
name: "James K.",
handle: "@jamesk",
text: "The inventory quality is simply unmatched. A fantastic experience.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-looking-car_23-2150171223.jpg?_wi=1",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/stylish-elegant-woman-car-salon_1157-32019.jpg"
/>
</div>
<div id="features" data-section="features">
<FeaturesDetailedCards
tag="Our Commitment"
title="Why Choose ApexMotors?"
description="We don't just sell cars; we provide peace of mind and long-term driving pleasure."
items={[
{
title: "Certified Quality",
description: "Every vehicle undergoes a rigorous 150-point inspection to ensure peak condition and safety.",
tags: [
"Safety",
"Reliability",
],
imageSrc: "http://img.b2bpic.net/free-photo/female-mechanic-repairing-car_1170-1617.jpg",
},
{
title: "Transparent Pricing",
description: "No hidden fees, no pressure tactics. Just honest, market-competitive pricing for your peace of mind.",
tags: [
"Value",
"Trust",
],
imageSrc: "http://img.b2bpic.net/free-vector/insurance-graphic-design-vector-illustration_24908-54470.jpg",
},
{
title: "Dedicated Support",
description: "Our team remains available for you long after the keys are handed over, ensuring continued satisfaction.",
tags: [
"Care",
"Support",
],
imageSrc: "http://img.b2bpic.net/free-vector/banking-icons-set_1284-6882.jpg",
},
]}
/>
</div>
<div id="products" data-section="products">
<ProductRatingCards
tag="Our Collection"
title="Premium Vehicles Available"
description="Browse our hand-picked selection of luxury sedans, versatile SUVs, and agile sports cars."
products={[
{
brand: "LuxeAuto",
name: "S-Series Coupe",
price: "$65,000",
rating: 5,
reviewCount: "128",
imageSrc: "http://img.b2bpic.net/free-photo/details-car-with-sunset-sky-reflecting-it_181624-43732.jpg",
},
{
brand: "UrbanCruiser",
name: "Elite SUV 4WD",
price: "$48,500",
rating: 4,
reviewCount: "94",
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-front-car_23-2147724809.jpg",
},
{
brand: "ApexPerformance",
name: "R-1 Convertible",
price: "$82,000",
rating: 5,
reviewCount: "210",
imageSrc: "http://img.b2bpic.net/free-photo/happy-groom-near-car_8353-61.jpg",
},
{
brand: "CitySmart",
name: "Compact Edition",
price: "$29,900",
rating: 4,
reviewCount: "56",
imageSrc: "http://img.b2bpic.net/free-photo/woman-using-mobile-phone-communication-online-application-standing-near-car-city-street-parking-outdoors-car-sharing-rental-service_158595-6723.jpg",
},
{
brand: "VoltMotors",
name: "E-Drive Sedan",
price: "$52,000",
rating: 5,
reviewCount: "88",
imageSrc: "http://img.b2bpic.net/free-photo/view-three-dimensional-car_23-2150998582.jpg",
},
{
brand: "CrossDrive",
name: "Urban Crossover",
price: "$38,000",
rating: 4,
reviewCount: "72",
imageSrc: "http://img.b2bpic.net/free-photo/trunk-sportscar-with-white-background_181624-25356.jpg",
},
]}
/>
</div>
<div id="social" data-section="social">
<SocialProofMarquee
tag="Trusted Partners"
title="Industry Leaders Partner with Us"
description="We collaborate with the world's finest automotive brands and finance institutions."
names={[
"LuxeAuto",
"UrbanCruiser",
"ApexPerformance",
"CitySmart",
"VoltMotors",
"CrossDrive",
"AutoSecure",
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricsMediaCards
tag="Our Impact"
title="Delivering Quality Nationwide"
description="Our numbers speak volumes about our commitment to excellence."
metrics={[
{
value: "1,500+",
title: "Vehicles Sold",
description: "Happy customers driving home their dream cars.",
imageSrc: "http://img.b2bpic.net/free-photo/couple-near-new-white-car-man-driving-work-his-wife-will-waiting-him_496169-275.jpg",
},
{
value: "98%",
title: "Satisfaction Rate",
description: "Consistently high marks from our valued client base.",
imageSrc: "http://img.b2bpic.net/free-photo/headlight-vintage-car-filtered-image-processed-vintage_1232-3018.jpg",
},
{
value: "15+",
title: "Regional Centers",
description: "Expanding our presence to serve you better.",
imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-image-travel-female-sitting-hood-amazing-red-convertible-sport-car-streets-los-angeles_273443-2505.jpg",
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialDetailedCards
tag="Customer Stories"
title="What Our Clients Say"
description="Read why thousands trust us with their automotive journey."
testimonials={[
{
title: "Exceeded Expectations",
quote: "ApexMotors turned a stressful process into an enjoyable experience. Top-notch service.",
name: "Marcus A.",
role: "Corporate Lead",
imageSrc: "http://img.b2bpic.net/free-photo/confident-businessman-suit-smiling-camera-standing-selfassured-against-white-background_1258-163584.jpg",
},
{
title: "Perfect Choice",
quote: "My new SUV is in pristine condition. The support team was extremely helpful throughout.",
name: "Julia M.",
role: "Business Owner",
imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-grey-background_613910-11739.jpg",
},
{
title: "Reliable & Fast",
quote: "Quick paperwork, honest talk, and a fantastic car. Couldn't recommend more.",
name: "Robert K.",
role: "Consultant",
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-taking-picture-car-dealership_329181-20030.jpg",
},
{
title: "Top-Tier Dealer",
quote: "Professional, clean, and honest. Truly the standard for automotive sales.",
name: "Claire P.",
role: "Architect",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-woman-pink-wall_179666-2807.jpg",
},
{
title: "Happy Driver",
quote: "The vehicle inspection reports made my decision very easy. Great transparency.",
name: "Samuel L.",
role: "Engineer",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-looking-car_23-2150171223.jpg?_wi=2",
},
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSimple
tag="Support"
title="Frequently Asked Questions"
description="Get quick answers to common questions about buying from ApexMotors."
items={[
{
question: "What documentation do I need to buy a car?",
answer: "You'll need a valid driver's license, proof of insurance, and financial documents if you are financing.",
},
{
question: "Do you offer trade-ins?",
answer: "Yes, we offer fair market appraisals for trade-ins towards your new vehicle.",
},
{
question: "Is there a warranty included?",
answer: "All our vehicles come with a complimentary 6-month engine and powertrain warranty.",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Get In Touch"
title="Ready to Find Your Next Car?"
description="Subscribe to our newsletter for exclusive inventory alerts and special offers."
inputPlaceholder="Enter your email address"
buttonText="Subscribe & Get Offers"
termsText="By subscribing, you agree to our privacy policy."
/>
</div>
<div id="footer" data-section="footer">
<FooterBasic
columns={[
{
title: "Inventory",
items: [
{
label: "Sedans",
href: "#products",
},
{
label: "SUVs",
href: "#products",
},
{
label: "Sports",
href: "#products",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "#",
},
{
label: "Careers",
href: "#",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
leftText="© 2024 ApexMotors. All rights reserved."
rightText="Driven by Quality."
/>
</div>
</>
<Routes>
<Route path="/" element={<HomePage />} />
</Routes>
);
}

View File

@@ -1,22 +1,374 @@
import NavbarCentered from "@/components/ui/NavbarCentered";
import { routes } from "@/routes";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSimple from '@/components/sections/faq/FaqSimple';
import FeaturesDetailedCards from '@/components/sections/features/FeaturesDetailedCards';
import FooterBasic from '@/components/sections/footer/FooterBasic';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
import NavbarCentered from '@/components/ui/NavbarCentered';
import ProductRatingCards from '@/components/sections/product/ProductRatingCards';
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
import TestimonialDetailedCards from '@/components/sections/testimonial/TestimonialDetailedCards';
const HomePage = () => {
export default function HomePage() {
return (
<div className="min-h-screen bg-background">
<NavbarCentered
logo="Logo"
navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
ctaButton={{ text: "Get Started", href: "#" }}
/>
<main className="pt-20 flex flex-col items-center justify-center min-h-[80vh] px-4">
<h1 className="text-4xl font-bold text-foreground mb-4">Welcome</h1>
<p className="text-lg text-muted-foreground max-w-xl text-center">
Your website content will appear here.
</p>
</main>
</div>
);
};
export default HomePage;
<>
<div id="nav" data-section="nav">
<NavbarCentered
logo="ApexMotors"
navItems={[
{
name: "Vehicles",
href: "#products",
},
{
name: "Why Us",
href: "#features",
},
{
name: "Reviews",
href: "#testimonials",
},
{
name: "FAQ",
href: "#faq",
},
]}
ctaButton={{
text: "Contact Sales",
href: "#contact",
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroOverlayTestimonial
tag="Luxury. Quality. Integrity."
title="Drive Your Dream Car Home"
description="Experience excellence in automotive sales with ApexMotors. Discover a refined collection of premium, quality-checked vehicles designed to elevate your journey."
primaryButton={{
text: "Browse Inventory",
href: "#products",
}}
secondaryButton={{
text: "Contact Us",
href: "#contact",
}}
testimonials={[
{
name: "Sarah J.",
handle: "@sarahj",
text: "The smoothest car buying experience ever. Highly recommended!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-happy-customer-car-dealership_23-2149117173.jpg",
},
{
name: "Michael B.",
handle: "@mikeb",
text: "Quality vehicles and transparent pricing. Couldn't ask for more.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-girl-holding-car-keys_23-2148333008.jpg",
},
{
name: "Elena R.",
handle: "@elenar",
text: "Found my perfect ride in record time. Excellent service.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-brunette-man-eyeglasses-smiles-widely-outside-happy-guy-black-jacket-white-tshirt-poses-near-airport_197531-27123.jpg",
},
{
name: "David L.",
handle: "@davidl",
text: "Professional team and impeccable inventory quality.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-young-woman-giving-thumbs-up-standing-isolated-rosy_176532-7958.jpg",
},
{
name: "James K.",
handle: "@jamesk",
text: "The inventory quality is simply unmatched. A fantastic experience.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-looking-car_23-2150171223.jpg?_wi=1",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/stylish-elegant-woman-car-salon_1157-32019.jpg"
/>
</div>
<div id="features" data-section="features">
<FeaturesDetailedCards
tag="Our Commitment"
title="Why Choose ApexMotors?"
description="We don't just sell cars; we provide peace of mind and long-term driving pleasure."
items={[
{
title: "Certified Quality",
description: "Every vehicle undergoes a rigorous 150-point inspection to ensure peak condition and safety.",
tags: [
"Safety",
"Reliability",
],
imageSrc: "http://img.b2bpic.net/free-photo/female-mechanic-repairing-car_1170-1617.jpg",
},
{
title: "Transparent Pricing",
description: "No hidden fees, no pressure tactics. Just honest, market-competitive pricing for your peace of mind.",
tags: [
"Value",
"Trust",
],
imageSrc: "http://img.b2bpic.net/free-vector/insurance-graphic-design-vector-illustration_24908-54470.jpg",
},
{
title: "Dedicated Support",
description: "Our team remains available for you long after the keys are handed over, ensuring continued satisfaction.",
tags: [
"Care",
"Support",
],
imageSrc: "http://img.b2bpic.net/free-vector/banking-icons-set_1284-6882.jpg",
},
]}
/>
</div>
<div id="products" data-section="products">
<ProductRatingCards
tag="Our Collection"
title="Premium Vehicles Available"
description="Browse our hand-picked selection of luxury sedans, versatile SUVs, and agile sports cars."
products={[
{
brand: "LuxeAuto",
name: "S-Series Coupe",
price: "$65,000",
rating: 5,
reviewCount: "128",
imageSrc: "http://img.b2bpic.net/free-photo/details-car-with-sunset-sky-reflecting-it_181624-43732.jpg",
},
{
brand: "UrbanCruiser",
name: "Elite SUV 4WD",
price: "$48,500",
rating: 4,
reviewCount: "94",
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-front-car_23-2147724809.jpg",
},
{
brand: "ApexPerformance",
name: "R-1 Convertible",
price: "$82,000",
rating: 5,
reviewCount: "210",
imageSrc: "http://img.b2bpic.net/free-photo/happy-groom-near-car_8353-61.jpg",
},
{
brand: "CitySmart",
name: "Compact Edition",
price: "$29,900",
rating: 4,
reviewCount: "56",
imageSrc: "http://img.b2bpic.net/free-photo/woman-using-mobile-phone-communication-online-application-standing-near-car-city-street-parking-outdoors-car-sharing-rental-service_158595-6723.jpg",
},
{
brand: "VoltMotors",
name: "E-Drive Sedan",
price: "$52,000",
rating: 5,
reviewCount: "88",
imageSrc: "http://img.b2bpic.net/free-photo/view-three-dimensional-car_23-2150998582.jpg",
},
{
brand: "CrossDrive",
name: "Urban Crossover",
price: "$38,000",
rating: 4,
reviewCount: "72",
imageSrc: "http://img.b2bpic.net/free-photo/trunk-sportscar-with-white-background_181624-25356.jpg",
},
]}
/>
</div>
<div id="social" data-section="social">
<SocialProofMarquee
tag="Trusted Partners"
title="Industry Leaders Partner with Us"
description="We collaborate with the world's finest automotive brands and finance institutions."
names={[
"LuxeAuto",
"UrbanCruiser",
"ApexPerformance",
"CitySmart",
"VoltMotors",
"CrossDrive",
"AutoSecure",
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricsMediaCards
tag="Our Impact"
title="Delivering Quality Nationwide"
description="Our numbers speak volumes about our commitment to excellence."
metrics={[
{
value: "1,500+",
title: "Vehicles Sold",
description: "Happy customers driving home their dream cars.",
imageSrc: "http://img.b2bpic.net/free-photo/couple-near-new-white-car-man-driving-work-his-wife-will-waiting-him_496169-275.jpg",
},
{
value: "98%",
title: "Satisfaction Rate",
description: "Consistently high marks from our valued client base.",
imageSrc: "http://img.b2bpic.net/free-photo/headlight-vintage-car-filtered-image-processed-vintage_1232-3018.jpg",
},
{
value: "15+",
title: "Regional Centers",
description: "Expanding our presence to serve you better.",
imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-image-travel-female-sitting-hood-amazing-red-convertible-sport-car-streets-los-angeles_273443-2505.jpg",
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialDetailedCards
tag="Customer Stories"
title="What Our Clients Say"
description="Read why thousands trust us with their automotive journey."
testimonials={[
{
title: "Exceeded Expectations",
quote: "ApexMotors turned a stressful process into an enjoyable experience. Top-notch service.",
name: "Marcus A.",
role: "Corporate Lead",
imageSrc: "http://img.b2bpic.net/free-photo/confident-businessman-suit-smiling-camera-standing-selfassured-against-white-background_1258-163584.jpg",
},
{
title: "Perfect Choice",
quote: "My new SUV is in pristine condition. The support team was extremely helpful throughout.",
name: "Julia M.",
role: "Business Owner",
imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-grey-background_613910-11739.jpg",
},
{
title: "Reliable & Fast",
quote: "Quick paperwork, honest talk, and a fantastic car. Couldn't recommend more.",
name: "Robert K.",
role: "Consultant",
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-taking-picture-car-dealership_329181-20030.jpg",
},
{
title: "Top-Tier Dealer",
quote: "Professional, clean, and honest. Truly the standard for automotive sales.",
name: "Claire P.",
role: "Architect",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-woman-pink-wall_179666-2807.jpg",
},
{
title: "Happy Driver",
quote: "The vehicle inspection reports made my decision very easy. Great transparency.",
name: "Samuel L.",
role: "Engineer",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-looking-car_23-2150171223.jpg?_wi=2",
},
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSimple
tag="Support"
title="Frequently Asked Questions"
description="Get quick answers to common questions about buying from ApexMotors."
items={[
{
question: "What documentation do I need to buy a car?",
answer: "You'll need a valid driver's license, proof of insurance, and financial documents if you are financing.",
},
{
question: "Do you offer trade-ins?",
answer: "Yes, we offer fair market appraisals for trade-ins towards your new vehicle.",
},
{
question: "Is there a warranty included?",
answer: "All our vehicles come with a complimentary 6-month engine and powertrain warranty.",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Get In Touch"
title="Ready to Find Your Next Car?"
description="Subscribe to our newsletter for exclusive inventory alerts and special offers."
inputPlaceholder="Enter your email address"
buttonText="Subscribe & Get Offers"
termsText="By subscribing, you agree to our privacy policy."
/>
</div>
<div id="footer" data-section="footer">
<FooterBasic
columns={[
{
title: "Inventory",
items: [
{
label: "Sedans",
href: "#products",
},
{
label: "SUVs",
href: "#products",
},
{
label: "Sports",
href: "#products",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "#",
},
{
label: "Careers",
href: "#",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
leftText="© 2024 ApexMotors. All rights reserved."
rightText="Driven by Quality."
/>
</div>
</>
);
}