Merge version_2 into main #2
433
src/app/page.tsx
433
src/app/page.tsx
@@ -2,17 +2,17 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { Award, Car, MapPin, ShieldCheck, Users } from "lucide-react";
|
||||
import MediaAbout from '@/components/sections/about/MediaAbout';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import { Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -30,409 +30,116 @@ export default function LandingPage() {
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "Vehicles",
|
||||
id: "#products",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "Vehicles", id: "#products" },
|
||||
{ name: "Pricing", id: "#pricing" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Pavitra Rental"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "rotated-rays-animated-grid",
|
||||
}}
|
||||
<HeroSplitDualMedia
|
||||
background={{ variant: "rotated-rays-animated-grid" }}
|
||||
title="Drive Your Dreams with Pavitra Rental"
|
||||
description="Premium car rental services in your city. Reliable, affordable, and ready when you are."
|
||||
buttons={[
|
||||
{
|
||||
text: "Browse Cars",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/manager-car-center-customer-expensive-car_651396-1145.jpg?_wi=1"
|
||||
imageAlt="Luxury car rental service"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-elegant-couple-car-salon_1157-22603.jpg",
|
||||
alt: "Stylish and elegant couple in a car salon",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/financial-independent-woman-buying-new-car_23-2149571899.jpg",
|
||||
alt: "Financial independent woman buying new car",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-black-woman-car-salon_1157-21423.jpg",
|
||||
alt: "Stylish black woman in a car salon",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/dealership-salesman-showing-clients-components-car-hood_482257-113640.jpg",
|
||||
alt: "Dealership salesman showing clients components under car hood",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-black-man-glasses-with-hat-wear-suit-with-handbag-against-luxury-car-rich-african-american-businessman_627829-3273.jpg",
|
||||
alt: "Stylish black man at glasses with hat wear on suit",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by 10,000+ happy travelers"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "24/7 Support",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Low Mileage Cars",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Insurance Included",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Easy Booking",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Clean Fleet",
|
||||
},
|
||||
tag="Exclusive Rental"
|
||||
rating={5}
|
||||
ratingText="Trusted by 10,000+ travelers"
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/manager-car-center-customer-expensive-car_651396-1145.jpg?_wi=1", imageAlt: "Luxury car" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/stylish-elegant-couple-car-salon_1157-22603.jpg", imageAlt: "Happy clients" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
<MediaAbout
|
||||
title="Excellence in Motion"
|
||||
metrics={[
|
||||
{
|
||||
icon: Car,
|
||||
label: "Vehicles",
|
||||
value: "500+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Years Experience",
|
||||
value: "15",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Happy Clients",
|
||||
value: "10k+",
|
||||
},
|
||||
{
|
||||
icon: MapPin,
|
||||
label: "Locations",
|
||||
value: "20+",
|
||||
},
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Safety Rated",
|
||||
value: "5/5",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
description="With over 15 years of experience, we provide a seamless rental experience across 20+ locations. Quality and safety are our promise."
|
||||
tag="About Us"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/dealership-salesman-showing-clients-components-car-hood_482257-113640.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardEight
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "24/7 Roadside Assistance",
|
||||
description: "We're here whenever you need us, day or night.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-working-call-center_23-2149288231.jpg",
|
||||
},
|
||||
{
|
||||
title: "Flexible Bookings",
|
||||
description: "Easy rescheduling and cancellation policies.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-customer-service-agent_23-2151933145.jpg",
|
||||
},
|
||||
{
|
||||
title: "Clean & Sanitized",
|
||||
description: "Every vehicle is deep-cleaned before pickup.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-bald-call-center-man-wearing-headset-sitting-desk-with-work-tools-isolated-purple-background_141793-84944.jpg",
|
||||
},
|
||||
{
|
||||
title: "Transparent Pricing",
|
||||
description: "No hidden fees, just clear rental rates.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-working-warehouse_329181-12822.jpg",
|
||||
},
|
||||
{
|
||||
title: "Top-Tier Fleet",
|
||||
description: "Modern cars for every budget and style.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gray-suv-driving-city-street-urban-power-style_169016-69878.jpg",
|
||||
},
|
||||
]}
|
||||
<FeatureCardTwentyOne
|
||||
title="Why Choose Pavitra Rental"
|
||||
description="Your safety and comfort are our top priority."
|
||||
accordionItems={[
|
||||
{ id: "1", title: "24/7 Roadside Assistance", content: "Always here whenever you need us." },
|
||||
{ id: "2", title: "Transparent Pricing", content: "No hidden fees, ever." },
|
||||
{ id: "3", title: "Clean Fleet", content: "Sanitized cars for your safety." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/gray-suv-driving-city-street-urban-power-style_169016-69878.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "City Sedan",
|
||||
price: "$45/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-exploration-dubai-s-evolving-cityscape_23-2151339709.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Luxury Cruiser",
|
||||
price: "$120/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/well-dressed-attractive-couple-leaning-luxury-car-outdoors-against-skyscraper_613910-19347.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Family SUV",
|
||||
price: "$85/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/off-road-car-wilderness_23-2151482977.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Crossover Hybrid",
|
||||
price: "$65/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-rear-view-mirror_1339-3045.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Sporty Coupe",
|
||||
price: "$150/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-infiniti-g37-coupe-outdoors_158538-24741.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Eco-EV",
|
||||
price: "$90/day",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-3d-car-model_23-2151138934.jpg",
|
||||
},
|
||||
]}
|
||||
<ProductCardTwo
|
||||
title="Our Fleet"
|
||||
description="Find the perfect vehicle for your next journey."
|
||||
description="Find the perfect vehicle for your journey."
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
products={[
|
||||
{ id: "1", brand: "Luxury", name: "City Sedan", price: "$45/day", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-exploration-dubai-s-evolving-cityscape_23-2151339709.jpg?_wi=1" },
|
||||
{ id: "2", brand: "Premium", name: "Luxury Cruiser", price: "$120/day", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/well-dressed-attractive-couple-leaning-luxury-car-outdoors-against-skyscraper_613910-19347.jpg?_wi=1" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "daily",
|
||||
badge: "Popular",
|
||||
price: "$45",
|
||||
subtitle: "Perfect for a quick trip",
|
||||
buttons: [
|
||||
{
|
||||
text: "Select",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Full insurance",
|
||||
"200km daily limit",
|
||||
"Free cancellation",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "weekly",
|
||||
badge: "Best Value",
|
||||
price: "$280",
|
||||
subtitle: "Ideal for business travel",
|
||||
buttons: [
|
||||
{
|
||||
text: "Select",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Full insurance",
|
||||
"Unlimited mileage",
|
||||
"24/7 support",
|
||||
"Priority check-in",
|
||||
],
|
||||
},
|
||||
]}
|
||||
<PricingCardTwo
|
||||
title="Simple Pricing"
|
||||
description="Transparent rates with no hidden fees."
|
||||
description="Transparent rates designed for everyone."
|
||||
animationType="slide-up"
|
||||
plans={[
|
||||
{ id: "daily", badge: "Popular", price: "$45", subtitle: "Daily rental package", buttons: [{ text: "Book Now", href: "#contact" }], features: ["Insurance included", "200km limit"] },
|
||||
{ id: "weekly", badge: "Saver", price: "$280", subtitle: "Weekly rental package", buttons: [{ text: "Book Now", href: "#contact" }], features: ["Insurance included", "Unlimited mileage"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Miller",
|
||||
date: "Oct 2023",
|
||||
title: "Frequent User",
|
||||
quote: "Reliable and professional. Highly recommended!",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/business-woman-green-suit-using-phone-outside-street_1303-29546.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/manager-car-center-customer-expensive-car_651396-1145.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer profile picture",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "James Wilson",
|
||||
date: "Sep 2023",
|
||||
title: "Business Traveler",
|
||||
quote: "Great vehicles and even better support.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-tourist-with-pink-bag-white-wall_179666-29217.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-customer-service-agent_23-2151933138.jpg?_wi=1",
|
||||
imageAlt: "satisfied customer profile picture",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emma Davis",
|
||||
date: "Aug 2023",
|
||||
title: "Tourist",
|
||||
quote: "Smooth process from pickup to return.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/friendly-happy-redhead-girl-smiling-lively-pretty-grin-pointing-down-index-fingers-offering-good_1258-228416.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-exploration-dubai-s-evolving-cityscape_23-2151339709.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer profile picture",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Mark Roberts",
|
||||
date: "Jul 2023",
|
||||
title: "Local Resident",
|
||||
quote: "Always my first choice for rentals.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/happy-staff_1098-15975.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/well-dressed-attractive-couple-leaning-luxury-car-outdoors-against-skyscraper_613910-19347.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer profile picture",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Lisa Chen",
|
||||
date: "Jun 2023",
|
||||
title: "Tech Professional",
|
||||
quote: "Excellent fleet variety and clean cars.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/fascinating-young-lady-stylish-yellow-pants-expressing-happiness-glad-european-girl-with-dark-hair-dancing-street-background_197531-26305.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/off-road-car-wilderness_23-2151482977.jpg?_wi=2",
|
||||
imageAlt: "satisfied customer profile picture",
|
||||
},
|
||||
]}
|
||||
<TestimonialCardTwo
|
||||
title="Client Stories"
|
||||
description="What our happy travelers say about us."
|
||||
description="Trusted by thousands of happy drivers."
|
||||
animationType="slide-up"
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah Miller", role: "Frequent User", testimonial: "The best rental experience I've had. Very professional.", imageSrc: "http://img.b2bpic.net/free-photo/business-woman-green-suit-using-phone-outside-street_1303-29546.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need insurance?",
|
||||
content: "All rentals come with basic insurance included.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What's the fuel policy?",
|
||||
content: "Please return the car with the same fuel level.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Can I return the car anywhere?",
|
||||
content: "Please check our drop-off locations list.",
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
title: "Are there age restrictions?",
|
||||
content: "Minimum age for renters is 21 years.",
|
||||
},
|
||||
{
|
||||
id: "f5",
|
||||
title: "Do you offer long-term rental?",
|
||||
content: "Yes, we have monthly rates available upon request.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Questions?"
|
||||
sideDescription="Get answers quickly."
|
||||
<FaqDouble
|
||||
title="Questions?"
|
||||
description="Find answers to your rental concerns."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "f1", title: "Is insurance included?", content: "Yes, every rental includes basic coverage." },
|
||||
{ id: "f2", title: "What is the age requirement?", content: "Minimum age is 21 years old." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
<ContactCenter
|
||||
tag="Booking"
|
||||
title="Ready to Book?"
|
||||
description="Contact us today for availability and special offers."
|
||||
mediaAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/happy-customer-service-agent_23-2151933138.jpg?_wi=2"
|
||||
title="Ready to hit the road?"
|
||||
description="Contact us today and get moving."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Fleet",
|
||||
href: "#products",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
<FooterLogoReveal
|
||||
logoText="Pavitra Rental"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user