Bob AI: Add home page
This commit is contained in:
@@ -1,297 +1,70 @@
|
||||
import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
|
||||
import FeaturesStatisticsCards from '@/components/sections/features/FeaturesStatisticsCards';
|
||||
import FooterBrandReveal from '@/components/sections/footer/FooterBrandReveal';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import NavbarCentered from '@/components/ui/NavbarCentered';
|
||||
import PricingPage from '@/components/sections/pricing/PricingPage';
|
||||
import ProductVariantCards from '@/components/sections/product/ProductVariantCards';
|
||||
import TestimonialRatingCards from '@/components/sections/testimonial/TestimonialRatingCards';
|
||||
import LegalSection from '@/components/sections/legal/LegalSection';
|
||||
|
||||
import { routes } from "@/routes";
|
||||
import NavbarCentered from "@/components/ui/NavbarCentered"; // Corrected import path
|
||||
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
|
||||
import FeaturesAlternatingSplit from "@/components/sections/features/FeaturesAlternatingSplit";
|
||||
import ContactCta from "@/components/sections/contact/ContactCta";
|
||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<div className="flex min-h-screen flex-col bg-background text-foreground">
|
||||
<NavbarCentered
|
||||
logo="DriveEasy"
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
name: "Vehicles",
|
||||
href: "#vehicles",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
{ name: "Services", href: "/services" },
|
||||
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
tag="Reliable Rental Service"
|
||||
title="Drive Your Way with DriveEasy"
|
||||
description="Premium car rentals for every journey. Discover a fleet of modern, well-maintained vehicles ready for your next adventure."
|
||||
primaryButton={{
|
||||
text: "Browse Fleet",
|
||||
href: "#vehicles",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/child-perspective-motorcar-generic-race_1232-3545.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutTestimonial
|
||||
tag="Why Us"
|
||||
quote="DriveEasy transformed our vacation. The booking process was seamless, and the car was in pristine condition. Excellent service!"
|
||||
author="Mark Thompson"
|
||||
role="Frequent Traveler"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/happy-auto-repairman-handshaking-with-female-customer-workshop_637285-9789.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="stats" data-section="stats">
|
||||
<FeaturesStatisticsCards
|
||||
tag="Our Impact"
|
||||
title="Trusted by Thousands"
|
||||
description="Data-driven excellence in vehicle rental experiences."
|
||||
items={[
|
||||
{
|
||||
title: "Vehicles",
|
||||
description: "Active fleet size",
|
||||
label: "Fleet",
|
||||
value: "500+",
|
||||
},
|
||||
{
|
||||
title: "Happy Clients",
|
||||
description: "Satisfied renters",
|
||||
label: "Clients",
|
||||
value: "15k+",
|
||||
},
|
||||
{
|
||||
title: "Locations",
|
||||
description: "Global reach",
|
||||
label: "Stations",
|
||||
value: "45",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="vehicles" data-section="vehicles">
|
||||
<ProductVariantCards
|
||||
tag="Our Fleet"
|
||||
title="Modern Vehicles"
|
||||
description="Choose from our wide selection of high-quality vehicles."
|
||||
products={[
|
||||
{
|
||||
name: "Economy Hatchback",
|
||||
variant: "Compact",
|
||||
price: "$45/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/family-car-salon-woman-buying-car-little-african-girl-with-mther_1157-45011.jpg",
|
||||
},
|
||||
{
|
||||
name: "Family SUV",
|
||||
variant: "Spacious",
|
||||
price: "$85/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-choosing-car-car-showroom_1303-22807.jpg",
|
||||
},
|
||||
{
|
||||
name: "Executive Sedan",
|
||||
variant: "Premium",
|
||||
price: "$120/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-businessman-white-shirt-speaking-by-phone-entering-his-car-while-standing-outdoors-streets-city-near-modern-office-center_496169-517.jpg",
|
||||
},
|
||||
{
|
||||
name: "Urban Crossover",
|
||||
variant: "Versatile",
|
||||
price: "$70/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-car-showroom-dealership_23-2149117122.jpg",
|
||||
},
|
||||
{
|
||||
name: "Sports Coupe",
|
||||
variant: "Performance",
|
||||
price: "$150/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-car_1157-6513.jpg",
|
||||
},
|
||||
{
|
||||
name: "Comfort Minivan",
|
||||
variant: "Group",
|
||||
price: "$110/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-with-cute-chihuahua-dog_23-2150265005.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<PricingPage />
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialRatingCards
|
||||
tag="Testimonials"
|
||||
title="User Stories"
|
||||
description="Hear from our happy customers."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Alice Johnson",
|
||||
role: "Corporate Client",
|
||||
quote: "Fantastic service and excellent vehicles.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lady-car-salon-woman-buying-car-elegant-woman-blue-dress_1157-45031.jpg",
|
||||
},
|
||||
{
|
||||
name: "Bob Smith",
|
||||
role: "Traveler",
|
||||
quote: "Easy booking and very helpful staff.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-technology-close-up-shot-happy-face-attractive-bearded-man-sitting-front-laptop-screen-smiling-joyfully-while-messaging-friends-online-via-social-networks_273609-6655.jpg",
|
||||
},
|
||||
{
|
||||
name: "Charlie Davis",
|
||||
role: "Local Renter",
|
||||
quote: "Reliable and consistent quality.",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-traveler-enjoys-serenity-high-altitude-wilderness_482257-124914.jpg",
|
||||
},
|
||||
{
|
||||
name: "Diana Prince",
|
||||
role: "Vacationer",
|
||||
quote: "Loved the clean and new car I got.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-customer-car-dealership-with-seller_23-2149106200.jpg",
|
||||
},
|
||||
{
|
||||
name: "Edward Norton",
|
||||
role: "Tourist",
|
||||
quote: "Best car rental experience so far.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-green-eyed-brunette-woman-hair-band-white-t-shirt-against-wall-windows-cacti_197531-17042.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqTwoColumn
|
||||
tag="Support"
|
||||
title="Common Questions"
|
||||
description="Find answers to our most popular questions here."
|
||||
items={[
|
||||
{
|
||||
question: "What is the age requirement?",
|
||||
answer: "You must be 21 years or older with a valid driver's license.",
|
||||
},
|
||||
{
|
||||
question: "Are insurance plans included?",
|
||||
answer: "We offer various insurance options, including full coverage.",
|
||||
},
|
||||
{
|
||||
question: "Can I cancel my booking?",
|
||||
answer: "Yes, cancellations are free if made 48 hours before pickup.",
|
||||
},
|
||||
{
|
||||
question: "Is mileage unlimited?",
|
||||
answer: "Most of our standard plans include unlimited mileage.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCta
|
||||
tag="Ready to go?"
|
||||
text="Start your booking today. Click the button to reach out."
|
||||
primaryButton={{
|
||||
text: "Contact Us",
|
||||
href: "#footer",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Book Fleet",
|
||||
href: "#vehicles",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="legal" data-section="legal">
|
||||
<LegalSection />
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBrandReveal
|
||||
brand="DriveEasy"
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
logo="Webild Cars"
|
||||
navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
|
||||
ctaButton={{ text: "Explore Models", href: "/ferrari" }}
|
||||
/>
|
||||
<main className="flex-grow">
|
||||
<HeroBillboard
|
||||
title="Experience Automotive Excellence"
|
||||
description="Discover a curated selection of the world's most iconic luxury and performance vehicles."
|
||||
primaryCta={{ text: "View All Models", href: "/ferrari" }}
|
||||
secondaryCta={{ text: "Contact Us", href: "/contact" }}
|
||||
image={{
|
||||
src: "https://images.unsplash.com/photo-1542239616-c56783935935?q=80&w=2940&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
|
||||
alt: "Luxury sports car on a scenic road",
|
||||
}}
|
||||
/>
|
||||
<FeaturesAlternatingSplit
|
||||
heading="Unmatched Performance & Design"
|
||||
description="Each vehicle in our collection represents the pinnacle of engineering and aesthetic brilliance."
|
||||
features={[
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
title: "Precision Engineering",
|
||||
description: "Meticulously crafted engines and chassis for an exhilarating drive.",
|
||||
image: {
|
||||
src: "https://images.unsplash.com/photo-1583313936149-8c673891d4e0?q=80&w=2940&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
|
||||
alt: "Engine bay of a high-performance car",
|
||||
},
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#",
|
||||
title: "Iconic Design",
|
||||
description: "Timeless aesthetics that turn heads and define luxury.",
|
||||
image: {
|
||||
src: "https://images.unsplash.com/photo-1552519507-da3b142c6e3d?q=80&w=2940&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
|
||||
alt: "Sleek sports car exterior",
|
||||
},
|
||||
},
|
||||
{
|
||||
label: "Blog",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Safety",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Locations",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Support",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
]}
|
||||
/>
|
||||
<ContactCta
|
||||
heading="Ready to Drive Your Dream Car?"
|
||||
description="Contact us today to schedule a private viewing or learn more about our exclusive inventory."
|
||||
primaryCta={{ text: "Get in Touch", href: "/contact" }}
|
||||
/>
|
||||
</main>
|
||||
<FooterSimple
|
||||
logo="Webild Cars"
|
||||
description="Driving the future of luxury automotive experiences."
|
||||
socialLinks={[
|
||||
{ name: "Facebook", href: "#" },
|
||||
{ name: "Twitter", href: "#" },
|
||||
{ name: "Instagram", href: "#" },
|
||||
]}
|
||||
links={[
|
||||
{ name: "Privacy Policy", href: "/policy" },
|
||||
{ name: "Terms of Service", href: "/policy" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -7,4 +7,5 @@ export interface Route {
|
||||
export const routes: Route[] = [
|
||||
{ path: '/', label: 'Home', pageFile: 'HomePage' },
|
||||
{ path: '/services', label: 'Services', pageFile: 'ServicesPage' },
|
||||
{ path: '/home', label: 'Home', pageFile: 'HomePage' },
|
||||
];
|
||||
|
||||
Reference in New Issue
Block a user