Files
0784ef6e-7c61-4ad2-9004-970…/src/app/page.tsx
2026-01-28 13:13:09 +00:00

287 lines
14 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import FeatureCardTwentyThree from "@/components/sections/feature/FeatureCardTwentyThree";
import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
import MediaAbout from "@/components/sections/about/MediaAbout";
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
import ContactText from "@/components/sections/contact/ContactText";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Sparkles, Car, Award, DollarSign, Heart, BookOpen, TrendingUp, Calendar, Zap, Star } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="background-highlight"
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="large"
background="floatingGradient"
cardStyle="inset"
primaryButtonStyle="flat"
secondaryButtonStyle="radial-glow"
headingFontWeight="normal"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Volva Sh"
navItems={[
{ name: "Fleet", id: "fleet" },
{ name: "Why Us", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "Testimonials", id: "testimonials" }
]}
button={{
text: "Book Now", href: "contact"
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
title="Premium Car Rental Experience"
description="Drive Your Dreams with Volva Sh. Discover our exclusive collection of luxury vehicles for every occasion."
tag="Welcome to Excellence"
tagIcon={Sparkles}
background={{ variant: "gradient-bars" }}
mediaItems={[
{
imageSrc: "https://img.b2bpic.net/free-photo/luxury-car-speeds-by-modern-building-dusk-generative-ai_188544-8048.jpg", imageAlt: "Luxury sports car"
},
{
imageSrc: "https://img.b2bpic.net/free-photo/elegant-uber-driver-giving-taxi-ride_23-2149241745.jpg", imageAlt: "Premium family SUV"
},
{
imageSrc: "https://img.b2bpic.net/free-photo/handsome-bearded-male-sunglasses-dressed-black-suit-sitting-luxury-car-against-skyscraper_613910-19325.jpg", imageAlt: "Elegant sedan"
},
{
imageSrc: "https://img.b2bpic.net/free-photo/fashionable-ladies-going-out-car_132075-12211.jpg", imageAlt: "Modern electric vehicle"
},
{
imageSrc: "https://img.b2bpic.net/free-photo/black-sedan-wet-highway-rain-rainy-drive_169016-69903.jpg", imageAlt: "Luxury automobile"
}
]}
buttons={[
{ text: "Explore Fleet", href: "fleet" },
{ text: "Instant Booking", href: "contact" }
]}
/>
</div>
<div id="fleet" data-section="fleet">
<ProductCardFour
title="Our Premium Fleet"
description="Handpicked vehicles for discerning travelers. Every car in our collection is meticulously maintained."
tag="Featured Vehicles"
tagIcon={Car}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="invertDefault"
gridVariant="uniform-all-items-equal"
products={[
{
id: "1", name: "Luxury Sedan", price: "$120/day", variant: "Premium | Leather | 5 Seats", imageSrc: "https://img.b2bpic.net/free-photo/grey-coupe-rainy-highway-motion-focus_169016-69693.jpg", imageAlt: "Luxury sedan"
},
{
id: "2", name: "Executive SUV", price: "$150/day", variant: "Spacious | AWD | 7 Seats", imageSrc: "https://img.b2bpic.net/free-photo/white-car-turning-city-street-modern-urban-motion_169016-69787.jpg", imageAlt: "Executive SUV"
},
{
id: "3", name: "Sports Car", price: "$180/day", variant: "High Performance | Convertible | 2 Seats", imageSrc: "https://img.b2bpic.net/free-photo/elegant-uber-driver-giving-taxi-ride_23-2149241747.jpg", imageAlt: "Sports car"
}
]}
carouselMode="buttons"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyThree
title="Why Choose Volva Sh"
description="Experience unparalleled service and quality in every rental."
tag="Our Advantages"
tagIcon={Award}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
features={[
{
id: "1", title: "24/7 Customer Support", tags: ["Support", "Always Available"],
imageSrc: "https://img.b2bpic.net/free-photo/people-working-call-center_23-2149288189.jpg", imageAlt: "Customer support team"
},
{
id: "2", title: "Comprehensive Insurance Included", tags: ["Protection", "Peace of Mind"],
imageSrc: "https://img.b2bpic.net/free-photo/young-distraught-call-center-agent-communicating-with-client-while-using-desktop-pc-office_637285-6461.jpg", imageAlt: "Insurance coverage"
},
{
id: "3", title: "Flexible Rental Terms", tags: ["Flexibility", "Your Schedule"],
imageSrc: "https://img.b2bpic.net/free-photo/people-working-call-center_23-2149288192.jpg", imageAlt: "Flexible options"
},
{
id: "4", title: "Competitive Pricing", tags: ["Best Rates", "Transparent"],
imageSrc: "https://img.b2bpic.net/free-photo/colleagues-working-together-call-center-office_23-2149256115.jpg", imageAlt: "Affordable pricing"
}
]}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardOne
title="Rental Plans for Every Journey"
description="Choose the perfect plan tailored to your travel needs."
tag="Transparent Pricing"
tagIcon={DollarSign}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="invertDefault"
plans={[
{
id: "daily", badge: "Daily Rental", badgeIcon: Calendar,
price: "$100-180", subtitle: "Perfect for short trips", features: [
"Pick-up and drop-off service", "Free fuel top-up", "Unlimited mileage", "Basic insurance included"
]
},
{
id: "weekly", badge: "Weekly Rental", badgeIcon: Zap,
price: "$600-1,000", subtitle: "Great value for extended stays", features: [
"Flexible scheduling", "Complimentary vehicle upgrades", "Premium roadside assistance", "Full coverage insurance", "Personal concierge service"
]
},
{
id: "monthly", badge: "Monthly Rental", badgeIcon: Star,
price: "$2,000-3,500", subtitle: "Best rates for long-term needs", features: [
"Unlimited mileage", "24/7 emergency support", "Vehicle replacement included", "Premium insurance package", "Dedicated account manager", "Priority booking access"
]
}
]}
carouselMode="buttons"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
title="What Our Clients Say"
description="Real experiences from satisfied customers who trusted Volva Sh."
tag="Customer Reviews"
tagIcon={Heart}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
speed={40}
topMarqueeDirection="left"
testimonials={[
{
id: "1", name: "Sarah Mitchell", handle: "@sarahm_travels", testimonial: "Volva Sh made my European road trip unforgettable. The luxury sedan was impeccable, and the service was exceptional. Highly recommended!", imageSrc: "https://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg", imageAlt: "Sarah Mitchell"
},
{
id: "2", name: "James Chen", handle: "@jchen_business", testimonial: "As a business traveler, I appreciate the reliability and professionalism. The booking process was seamless, and the vehicles are always pristine.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "James Chen"
},
{
id: "3", name: "Emma Rodriguez", handle: "@emma_adventures", testimonial: "Perfect for our family vacation! The spacious SUV, friendly staff, and competitive pricing made everything stress-free. We're booking again!", imageSrc: "https://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg", imageAlt: "Emma Rodriguez"
},
{
id: "4", name: "Michael Thompson", handle: "@mthompson_exec", testimonial: "Premium experience from start to finish. The attention to detail in vehicle maintenance and customer service is unmatched. Worth every penny.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-smiley-woman-library_23-2149204737.jpg", imageAlt: "Michael Thompson"
},
{
id: "5", name: "Lisa Anderson", handle: "@lisaandtravel", testimonial: "I've rented from many companies, but Volva Sh stands out. Excellent vehicles, transparent pricing, and genuine care for customer satisfaction.", imageSrc: "https://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2533.jpg", imageAlt: "Lisa Anderson"
},
{
id: "6", name: "David Park", handle: "@davidpark_wheels", testimonial: "The sports car rental was the highlight of my trip. Incredible performance, impeccable condition, and insurance hassle was completely taken care of.", imageSrc: "https://img.b2bpic.net/free-photo/confident-businessman-smiling_107420-84734.jpg", imageAlt: "David Park"
}
]}
/>
</div>
<div id="about" data-section="about">
<MediaAbout
title="Elevate Your Journey"
description="Volva Sh combines luxury vehicles with exceptional service. For over a decade, we've been committed to providing world-class car rental experiences."
tag="Our Story"
tagIcon={BookOpen}
imageSrc="https://img.b2bpic.net/free-photo/woman-getting-taxi-car_23-2149149625.jpg"
imageAlt="Luxury vehicle interior"
useInvertedBackground="invertDefault"
buttons={[
{ text: "Learn More", href: "contact" }
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
title="By The Numbers"
description="Trusted by thousands of satisfied customers worldwide."
tag="Our Impact"
tagIcon={TrendingUp}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
metrics={[
{
id: "1", icon: Car,
title: "Vehicles", value: "500+"
},
{
id: "2", icon: TrendingUp,
title: "Happy Clients", value: "25,000+"
},
{
id: "3", icon: TrendingUp,
title: "Cities", value: "45"
},
{
id: "4", icon: Award,
title: "Years Experience", value: "10+"
}
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to start your next adventure? Book your perfect vehicle today and experience the Volva Sh difference."
animationType="entrance-slide"
useInvertedBackground="invertDefault"
buttons={[
{ text: "Reserve Now", href: "#contact-form" },
{ text: "View Fleet", href: "fleet" }
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
logoText="Volva Sh"
copyrightText="© 2025 Volva Sh Car Rentals. All rights reserved."
columns={[
{
title: "Service", items: [
{ label: "Fleet", href: "fleet" },
{ label: "Pricing", href: "pricing" },
{ label: "Booking", href: "contact" }
]
},
{
title: "Company", items: [
{ label: "About Us", href: "about" },
{ label: "Why Choose Us", href: "features" },
{ label: "Testimonials", href: "testimonials" }
]
},
{
title: "Support", items: [
{ label: "Contact", href: "contact" },
{ label: "FAQ", href: "faq" },
{ label: "Support", href: "contact" }
]
}
]}
/>
</div>
</ThemeProvider>
);
}