Merge version_1_1781982785068 into main #1
@@ -7,96 +7,55 @@ import { StyleProvider } from "@/components/ui/StyleProvider";
|
||||
|
||||
export default function Layout() {
|
||||
const navItems = [
|
||||
{
|
||||
"name": "Features",
|
||||
"href": "#about"
|
||||
},
|
||||
{
|
||||
"name": "Fleet",
|
||||
"href": "#fleet"
|
||||
},
|
||||
{
|
||||
"name": "Pricing",
|
||||
"href": "#pricing"
|
||||
},
|
||||
{
|
||||
"name": "FAQ",
|
||||
"href": "#faq"
|
||||
},
|
||||
{
|
||||
"name": "Hero",
|
||||
"href": "#hero"
|
||||
},
|
||||
{
|
||||
"name": "Metrics",
|
||||
"href": "#metrics"
|
||||
},
|
||||
{
|
||||
"name": "Testimonials",
|
||||
"href": "#testimonials"
|
||||
}
|
||||
];
|
||||
{ name: "Features", href: "#about" },
|
||||
{ name: "Fleet", href: "#fleet" },
|
||||
{ name: "Pricing", href: "#pricing" },
|
||||
{ name: "FAQ", href: "#faq" },
|
||||
{ name: "Hero", href: "#hero" },
|
||||
{ name: "Metrics", href: "#metrics" },
|
||||
{ name: "Testimonials", href: "#testimonials" }
|
||||
];
|
||||
|
||||
return (
|
||||
<StyleProvider buttonVariant="bubble" siteBackground="noise" heroBackground="cornerGlow">
|
||||
<SiteBackgroundSlot />
|
||||
<SectionErrorBoundary name="navbar">
|
||||
<NavbarFloatingLogo
|
||||
logo="DriveEase"
|
||||
ctaButton={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
navItems={navItems} />
|
||||
logo="DriveEase"
|
||||
logoImageSrc="http://img.b2bpic.net/free-vector/car-rental-25-versatile-vector-designs-all-your-rental-needs_1142-22319.jpg"
|
||||
ctaButton={{
|
||||
text: "Book Now", href: "#contact"}}
|
||||
navItems={navItems}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
<main className="flex-grow">
|
||||
<Outlet />
|
||||
</main>
|
||||
<SectionErrorBoundary name="footer">
|
||||
<FooterSimpleMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/woman-making-desicion-buy-car_1303-13859.jpg"
|
||||
brand="DriveEase"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
imageSrc="http://img.b2bpic.net/free-photo/woman-making-desicion-buy-car_1303-13859.jpg"
|
||||
brand="DriveEase"
|
||||
columns={[
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Careers", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyright="© 2024 DriveEase. All rights reserved."
|
||||
links={[
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "Fleet",
|
||||
href: "#fleet",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
]}
|
||||
copyright="© 2024 DriveEase. All rights reserved."
|
||||
links={[
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Fleet", href: "#fleet" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</StyleProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -13,291 +13,137 @@ import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<>
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroBrand
|
||||
brand="DriveEase Rental"
|
||||
description="Experience freedom with our premium fleet. Reliable, affordable, and ready for your next adventure."
|
||||
primaryButton={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Fleet",
|
||||
href: "#fleet",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/senior-woman-traveling-alone-having-fun_23-2149034805.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
brand="DriveEase Rental"
|
||||
description="Experience freedom with our premium fleet. Reliable, affordable, and ready for your next adventure."
|
||||
primaryButton={{ text: "Book Now", href: "#contact" }}
|
||||
secondaryButton={{ text: "View Fleet", href: "#fleet" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/senior-woman-traveling-alone-having-fun_23-2149034805.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Why Choose Us"
|
||||
title="The Better Way to Rent"
|
||||
description="We offer more than just cars. We provide peace of mind with 24/7 support, transparent pricing, and flexible rental plans."
|
||||
items={[
|
||||
{
|
||||
icon: CheckCircle,
|
||||
title: "Transparent Pricing",
|
||||
description: "No hidden fees, ever.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Comprehensive Insurance",
|
||||
description: "Drive safely with full coverage.",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Quick Booking",
|
||||
description: "From search to road in minutes.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-man-accepting-keys-new-house_23-2148346265.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Why Choose Us"
|
||||
title="The Better Way to Rent"
|
||||
description="We offer more than just cars. We provide peace of mind with 24/7 support, transparent pricing, and flexible rental plans."
|
||||
items={[
|
||||
{ icon: "CheckCircle", title: "Transparent Pricing", description: "No hidden fees, ever." },
|
||||
{ icon: "Shield", title: "Comprehensive Insurance", description: "Drive safely with full coverage." },
|
||||
{ icon: "Zap", title: "Quick Booking", description: "From search to road in minutes." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/front-view-man-accepting-keys-new-house_23-2148346265.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="fleet" data-section="fleet">
|
||||
<SectionErrorBoundary name="fleet">
|
||||
<div id="fleet" data-section="fleet">
|
||||
<SectionErrorBoundary name="fleet">
|
||||
<FeaturesImageBento
|
||||
tag="Our Vehicles"
|
||||
title="Drive Your Choice"
|
||||
description="Explore our curated selection of top-tier vehicles ranging from compact city cars to luxurious SUVs."
|
||||
items={[
|
||||
{
|
||||
title: "Compact",
|
||||
description: "Perfect for city trips",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dark-blue-suv-wet-road-power-safety-modern-design_169016-70068.jpg",
|
||||
},
|
||||
{
|
||||
title: "Premium SUV",
|
||||
description: "Comfort for long journeys",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-business-woman-sitting-car_1303-22819.jpg",
|
||||
},
|
||||
{
|
||||
title: "Electric Sedan",
|
||||
description: "Sustainable and stylish",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-electric-car-charging_23-2149362807.jpg",
|
||||
},
|
||||
{
|
||||
title: "Minivan",
|
||||
description: "Family adventures",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-getting-out-car-while-road-trip_23-2148851244.jpg",
|
||||
},
|
||||
{
|
||||
title: "Sporty Coupe",
|
||||
description: "Fast and agile",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/superhero-car-vintage-style_23-2151636175.jpg",
|
||||
},
|
||||
{
|
||||
title: "Business Sedan",
|
||||
description: "Professional comfort",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-holding-suitcase_23-2149901406.jpg",
|
||||
},
|
||||
{
|
||||
title: "4x4 Jeep",
|
||||
description: "Built for off-road",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-playing-car_23-2148349740.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Our Vehicles"
|
||||
title="Drive Your Choice"
|
||||
description="Explore our curated selection of top-tier vehicles ranging from compact city cars to luxurious SUVs."
|
||||
items={[
|
||||
{ title: "Compact", description: "Perfect for city trips", imageSrc: "http://img.b2bpic.net/free-photo/dark-blue-suv-wet-road-power-safety-modern-design_169016-70068.jpg" },
|
||||
{ title: "Premium SUV", description: "Comfort for long journeys", imageSrc: "http://img.b2bpic.net/free-photo/young-business-woman-sitting-car_1303-22819.jpg" },
|
||||
{ title: "Electric Sedan", description: "Sustainable and stylish", imageSrc: "http://img.b2bpic.net/free-photo/close-up-electric-car-charging_23-2149362807.jpg" },
|
||||
{ title: "Minivan", description: "Family adventures", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-getting-out-car-while-road-trip_23-2148851244.jpg" },
|
||||
{ title: "Sporty Coupe", description: "Fast and agile", imageSrc: "http://img.b2bpic.net/free-photo/superhero-car-vintage-style_23-2151636175.jpg" },
|
||||
{ title: "Business Sedan", description: "Professional comfort", imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-holding-suitcase_23-2149901406.jpg" },
|
||||
{ title: "4x4 Jeep", description: "Built for off-road", imageSrc: "http://img.b2bpic.net/free-photo/young-couple-playing-car_23-2148349740.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<PricingLayeredCards
|
||||
tag="Flexible Rates"
|
||||
title="Simple Daily Pricing"
|
||||
description="Select the plan that fits your schedule."
|
||||
plans={[
|
||||
{
|
||||
tag: "Daily",
|
||||
price: "$49",
|
||||
description: "Per day",
|
||||
primaryButton: {
|
||||
text: "Book",
|
||||
href: "#",
|
||||
},
|
||||
features: [
|
||||
"Unlimited mileage",
|
||||
"24/7 Support",
|
||||
],
|
||||
},
|
||||
{
|
||||
tag: "Weekly",
|
||||
price: "$299",
|
||||
description: "Per week",
|
||||
primaryButton: {
|
||||
text: "Book",
|
||||
href: "#",
|
||||
},
|
||||
features: [
|
||||
"15% discount",
|
||||
"Free roadside assistance",
|
||||
"Priority Pickup",
|
||||
],
|
||||
},
|
||||
{
|
||||
tag: "Monthly",
|
||||
price: "$899",
|
||||
description: "Per month",
|
||||
primaryButton: {
|
||||
text: "Book",
|
||||
href: "#",
|
||||
},
|
||||
features: [
|
||||
"25% discount",
|
||||
"Free upgrades",
|
||||
"Dedicated Support",
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Flexible Rates"
|
||||
title="Simple Daily Pricing"
|
||||
description="Select the plan that fits your schedule."
|
||||
plans={[
|
||||
{ tag: "Daily", price: "$49", description: "Per day", primaryButton: { text: "Book", href: "#" }, features: ["Unlimited mileage", "24/7 Support"] },
|
||||
{ tag: "Weekly", price: "$299", description: "Per week", primaryButton: { text: "Book", href: "#" }, features: ["15% discount", "Free roadside assistance", "Priority Pickup"] },
|
||||
{ tag: "Monthly", price: "$899", description: "Per month", primaryButton: { text: "Book", href: "#" }, features: ["25% discount", "Free upgrades", "Dedicated Support"] },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsSimpleCards
|
||||
tag="Our Reach"
|
||||
title="Driving Satisfaction"
|
||||
description="Proven results for thousands of happy travelers."
|
||||
metrics={[
|
||||
{
|
||||
value: "500+",
|
||||
description: "Available Vehicles",
|
||||
},
|
||||
{
|
||||
value: "10k+",
|
||||
description: "Satisfied Customers",
|
||||
},
|
||||
{
|
||||
value: "15",
|
||||
description: "Cities Serviced",
|
||||
},
|
||||
{
|
||||
value: "4.9",
|
||||
description: "Avg User Rating",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Our Reach"
|
||||
title="Driving Satisfaction"
|
||||
description="Proven results for thousands of happy travelers."
|
||||
metrics={[
|
||||
{ value: "500+", description: "Available Vehicles" },
|
||||
{ value: "10k+", description: "Satisfied Customers" },
|
||||
{ value: "15", description: "Cities Serviced" },
|
||||
{ value: "4.9", description: "Avg User Rating" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialRatingCards
|
||||
tag="Reviews"
|
||||
title="Customer Stories"
|
||||
description="What our users say about their DriveEase experience."
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alice M.",
|
||||
role: "Traveler",
|
||||
quote: "The booking process was seamless and the car was pristine.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Bob D.",
|
||||
role: "Business User",
|
||||
quote: "Reliable and high-quality vehicles. My go-to rental.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-waving-with-copy-space_23-2148631403.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Charlie S.",
|
||||
role: "Adventurer",
|
||||
quote: "Got a great SUV for our mountain trip. Smooth experience.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-people-working-together_23-2148826969.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Dana L.",
|
||||
role: "Family",
|
||||
quote: "The minivan we rented was perfect for our family road trip.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-ethnic-man-with-curly-hair_23-2148203568.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Evan K.",
|
||||
role: "Commuter",
|
||||
quote: "Best customer support I've encountered. Highly recommend.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-confident-corporate-woman-professional-entrepreneur-smiling-cross-arms-chest-smiling-enthusiastic-standing-white-background_1258-85600.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Reviews"
|
||||
title="Customer Stories"
|
||||
description="What our users say about their DriveEase experience."
|
||||
testimonials={[
|
||||
{ name: "Alice M.", role: "Traveler", quote: "The booking process was seamless and the car was pristine.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg" },
|
||||
{ name: "Bob D.", role: "Business User", quote: "Reliable and high-quality vehicles. My go-to rental.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-waving-with-copy-space_23-2148631403.jpg" },
|
||||
{ name: "Charlie S.", role: "Adventurer", quote: "Got a great SUV for our mountain trip. Smooth experience.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/business-people-working-together_23-2148826969.jpg" },
|
||||
{ name: "Dana L.", role: "Family", quote: "The minivan we rented was perfect for our family road trip.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confident-ethnic-man-with-curly-hair_23-2148203568.jpg" },
|
||||
{ name: "Evan K.", role: "Commuter", quote: "Best customer support I've encountered. Highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-confident-corporate-woman-professional-entrepreneur-smiling-cross-arms-chest-smiling-enthusiastic-standing-white-background_1258-85600.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SectionErrorBoundary name="social-proof">
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SectionErrorBoundary name="social-proof">
|
||||
<SocialProofMarquee
|
||||
tag="Trusted By"
|
||||
title="Partners"
|
||||
description="Working with the best brands in the travel industry."
|
||||
names={[
|
||||
"Expedia",
|
||||
"Booking.com",
|
||||
"Travelocity",
|
||||
"Kayak",
|
||||
"Skyscanner",
|
||||
"Airbnb",
|
||||
"Hotels.com",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Trusted By"
|
||||
title="Partners"
|
||||
description="Working with the best brands in the travel industry."
|
||||
names={["Expedia", "Booking.com", "Travelocity", "Kayak", "Skyscanner", "Airbnb", "Hotels.com"]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqSimple
|
||||
tag="Support"
|
||||
title="Frequently Asked Questions"
|
||||
description="Common questions answered to make your rental journey easier."
|
||||
items={[
|
||||
{
|
||||
question: "What is required to rent a car?",
|
||||
answer: "You need a valid driver's license, credit card, and must be at least 21 years old.",
|
||||
},
|
||||
{
|
||||
question: "Are insurance options included?",
|
||||
answer: "Yes, we offer multiple insurance packages tailored to your needs.",
|
||||
},
|
||||
{
|
||||
question: "Can I cancel my reservation?",
|
||||
answer: "Cancellations made 24 hours in advance are fully refundable.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Support"
|
||||
title="Frequently Asked Questions"
|
||||
description="Common questions answered to make your rental journey easier."
|
||||
items={[
|
||||
{ question: "What is required to rent a car?", answer: "You need a valid driver's license, credit card, and must be at least 21 years old." },
|
||||
{ question: "Are insurance options included?", answer: "Yes, we offer multiple insurance packages tailored to your needs." },
|
||||
{ question: "Can I cancel my reservation?", answer: "Cancellations made 24 hours in advance are fully refundable." },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Book Your Trip"
|
||||
text="Ready to get behind the wheel? Book now and hit the open road today."
|
||||
primaryButton={{
|
||||
text: "Contact Support",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Start Booking",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Book Your Trip"
|
||||
text="Ready to get behind the wheel? Book now and hit the open road today."
|
||||
primaryButton={{ text: "Contact Support", href: "#" }}
|
||||
secondaryButton={{ text: "Start Booking", href: "#" }}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user