Merge version_2 into main #4
423
src/app/page.tsx
423
src/app/page.tsx
@@ -2,16 +2,15 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import { Car, Star, MapPin, CheckCircle } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -32,89 +31,74 @@ export default function LandingPage() {
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
|
||||
name: "Home", id: "home", href: "/"
|
||||
},
|
||||
{
|
||||
name: "Book a Ride",
|
||||
id: "book-ride",
|
||||
|
||||
name: "Book a Ride", id: "book-ride", href: "/book-ride"
|
||||
},
|
||||
{
|
||||
name: "How it Works",
|
||||
id: "how-it-works",
|
||||
|
||||
name: "How it Works", id: "how-it-works", href: "/#how-it-works"
|
||||
},
|
||||
{\n name: "About Us", id: "about-us", href: "/about"
|
||||
},
|
||||
{
|
||||
name: "About Us",
|
||||
id: "about-us",
|
||||
|
||||
name: "Pricing", id: "pricing", href: "/pricing"
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
|
||||
},
|
||||
{
|
||||
name: "User Login",
|
||||
id: "user-login",
|
||||
|
||||
},
|
||||
{
|
||||
name: "Driver Login",
|
||||
id: "driver-login",
|
||||
|
||||
},
|
||||
{
|
||||
name: "Admin Login",
|
||||
id: "admin-login",
|
||||
|
||||
},
|
||||
name: "Contact", id: "contact", href: "/#contact"
|
||||
}
|
||||
]}
|
||||
brandName="BookMyRide"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "downward-rays-animated-grid",
|
||||
}}
|
||||
variant: "downward-rays-animated-grid"}}
|
||||
title="Your Ride, Just a Tap Away"
|
||||
description="Experience seamless and safe travel with BookMyRide. Instant bookings, reliable drivers, and affordable fares await."
|
||||
tag="Start Your Journey"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "/book-ride",
|
||||
text: "Book Now", href: "/book-ride"},
|
||||
{
|
||||
text: "Learn More", href: "/#how-it-works"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-futuristic-ride-sharing-app-interface--1774242857229-5c166130.png?_wi=1", imageAlt: "Ride booking app interface on a smartphone"},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Our Mission to Reshape Mobility"
|
||||
description="At BookMyRide, we believe in a future where transportation is seamless, sustainable, and accessible to everyone. We're driven by innovation and a commitment to our community, constantly striving to enhance your travel experience."
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More", href: "/about"},
|
||||
]}
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Reliability You Can Trust", description: "Always on time, every time. Our network of drivers ensures you reach your destination without a hitch.", icon: CheckCircle
|
||||
},
|
||||
{
|
||||
text: "Learn More",
|
||||
href: "#how-it-works",
|
||||
title: "Safety First, Always", description: "Your well-being is our top priority. Advanced safety features and rigorous driver vetting are standard.", icon: CheckCircle
|
||||
},
|
||||
{
|
||||
title: "Affordable & Transparent Pricing", description: "Enjoy clear, upfront fares with no hidden surprises. Quality service shouldn't break the bank.", icon: CheckCircle
|
||||
},
|
||||
{
|
||||
title: "Eco-Conscious Choices", description: "Committed to a greener planet, we offer eco-friendly ride options for sustainable travel.", icon: CheckCircle
|
||||
},
|
||||
]}
|
||||
avatars={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-smiling-young-1774242857187-53c82054.png",
|
||||
alt: "Rider Sarah",
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-confident-man-1774242854791-73eb0078.png",
|
||||
alt: "Rider Michael",
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-smiling-middl-1774242855069-c4c66ff7.png",
|
||||
alt: "Rider Emily",
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-thoughtful-yo-1774242855507-be4b1113.png",
|
||||
alt: "Rider David",
|
||||
},
|
||||
]}
|
||||
avatarText="Join thousands of happy riders!"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-futuristic-ride-sharing-app-interface--1774242857229-5c166130.png?_wi=1"
|
||||
imageAlt="Ride booking app interface on a smartphone"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-futuristic-ride-sharing-app-interface--1774242857229-5c166130.png?_wi=2"
|
||||
imageAlt="A futuristic ride-sharing app interface on a smartphone"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
@@ -127,84 +111,13 @@ export default function LandingPage() {
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "Request a Ride",
|
||||
description: "Open the app, enter your destination, and choose your preferred ride type. Get an instant fare estimate.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-hand-holding-a-smar-1774242855926-911a9587.png?_wi=1",
|
||||
imageAlt: "Hand holding smartphone with ride request screen",
|
||||
},
|
||||
title: "Request a Ride", description: "Open the app, enter your destination, and choose your preferred ride type. Get an instant fare estimate.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-hand-holding-a-smar-1774242855926-911a9587.png?_wi=1", imageAlt: "Hand holding smartphone with ride request screen"},
|
||||
{
|
||||
id: 2,
|
||||
title: "Enjoy Your Ride",
|
||||
description: "A nearby driver will accept your request. Track your driver's arrival and enjoy a comfortable journey to your destination.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-comfortable-interio-1774242855299-fa38a449.png?_wi=1",
|
||||
imageAlt: "Interior of a modern car during a ride",
|
||||
},
|
||||
title: "Enjoy Your Ride", description: "A nearby driver will accept your request. Track your driver's arrival and enjoy a comfortable journey to your destination.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-comfortable-interio-1774242855299-fa38a449.png?_wi=1", imageAlt: "Interior of a modern car during a ride"},
|
||||
{
|
||||
id: 3,
|
||||
title: "Pay with Ease",
|
||||
description: "Securely pay through the app using various payment methods. Rate your driver and provide feedback on your experience.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-secure-mobile-payme-1774242855753-d94bf0a6.png?_wi=1",
|
||||
imageAlt: "Mobile payment interface on a smartphone",
|
||||
},
|
||||
]}
|
||||
title="How It Works: Seamlessly Book Your Ride"
|
||||
description="Booking a ride with BookMyRide is easy and intuitive. Follow these simple steps for a stress-free experience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="About BookMyRide: Driving the Future of Commute"
|
||||
description="BookMyRide is dedicated to transforming urban mobility with innovative technology and a commitment to rider satisfaction. We connect you with reliable transportation, ensuring every journey is safe, comfortable, and efficient."
|
||||
metrics={[
|
||||
{
|
||||
value: "10M+",
|
||||
title: "Rides Completed",
|
||||
},
|
||||
{
|
||||
value: "50K+",
|
||||
title: "Active Drivers",
|
||||
},
|
||||
{
|
||||
value: "100+",
|
||||
title: "Cities Served",
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-clean-modern-infographic-displaying-ke-1774242855781-d47d661d.png"
|
||||
imageAlt="Infographic showing ride-sharing statistics"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "Request a Ride",
|
||||
description: "Open the app, enter your destination, and choose your preferred ride type. Get an instant fare estimate.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-hand-holding-a-smar-1774242855926-911a9587.png?_wi=2",
|
||||
imageAlt: "Hand holding smartphone with ride request screen",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Enjoy Your Ride",
|
||||
description: "A nearby driver will accept your request. Track your driver's arrival and enjoy a comfortable journey to your destination.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-comfortable-interio-1774242855299-fa38a449.png?_wi=2",
|
||||
imageAlt: "Interior of a modern car during a ride",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Pay with Ease",
|
||||
description: "Securely pay through the app using various payment methods. Rate your driver and provide feedback on your experience.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-secure-mobile-payme-1774242855753-d94bf0a6.png?_wi=2",
|
||||
imageAlt: "Mobile payment interface on a smartphone",
|
||||
},
|
||||
title: "Pay with Ease", description: "Securely pay through the app using various payment methods. Rate your driver and provide feedback on your experience.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/an-illustration-of-a-secure-mobile-payme-1774242855753-d94bf0a6.png?_wi=1", imageAlt: "Mobile payment interface on a smartphone"},
|
||||
]}
|
||||
title="How It Works: Seamlessly Book Your Ride"
|
||||
description="Booking a ride with BookMyRide is easy and intuitive. Follow these simple steps for a stress-free experience."
|
||||
@@ -212,247 +125,107 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardFour
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "economy",
|
||||
name: "Economy",
|
||||
price: "Starting at $5",
|
||||
variant: "Affordable & Quick",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-sleek-modern-economy-car-suitable-for--1774242855965-a269bd96.png",
|
||||
imageAlt: "Modern economy car",
|
||||
},
|
||||
id: "economy", name: "Economy", price: "Starting at $5", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-sleek-modern-economy-car-suitable-for--1774242855965-a269bd96.png", imageAlt: "Modern economy car"},
|
||||
{
|
||||
id: "comfort",
|
||||
name: "Comfort",
|
||||
price: "Starting at $10",
|
||||
variant: "Spacious & Relaxing",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-luxurious-high-end-sedan-ideal-for-pre-1774242855806-70ef39b0.png",
|
||||
imageAlt: "Comfort class car",
|
||||
},
|
||||
id: "comfort", name: "Comfort", price: "Starting at $10", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-luxurious-high-end-sedan-ideal-for-pre-1774242855806-70ef39b0.png", imageAlt: "Comfort class car"},
|
||||
{
|
||||
id: "suv",
|
||||
name: "SUV",
|
||||
price: "Starting at $15",
|
||||
variant: "For Groups & Luggage",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-robust-and-spacious-suv-perfect-for-gr-1774242855550-c33cf1b1.png",
|
||||
imageAlt: "Spacious SUV",
|
||||
},
|
||||
id: "suv", name: "SUV", price: "Starting at $15", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-robust-and-spacious-suv-perfect-for-gr-1774242855550-c33cf1b1.png", imageAlt: "Spacious SUV"},
|
||||
]}
|
||||
title="Our Fleet: Rides for Every Occasion"
|
||||
description="From daily commutes to special events, choose the perfect ride that fits your needs and budget."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
title="Our Impact in Numbers"
|
||||
description="See the scale of BookMyRide's reach and reliability."
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
date: "2 days ago",
|
||||
title: "Reliable and Punctual",
|
||||
quote: "BookMyRide has been a game-changer for my daily commute. Always on time and the drivers are incredibly professional. Highly recommended!",
|
||||
tag: "Daily Commuter",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-smiling-young-1774242857187-53c82054.png",
|
||||
avatarAlt: "Sarah J. avatar",
|
||||
id: "1", value: "500K+", title: "Rides Completed", description: "Across all cities since launch.", icon: Car
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael C.",
|
||||
date: "1 week ago",
|
||||
title: "Best App for City Travel",
|
||||
quote: "I travel frequently for business, and BookMyRide makes it so much easier. The app is user-friendly, and the rides are always comfortable.",
|
||||
tag: "Business Traveler",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-confident-man-1774242854791-73eb0078.png",
|
||||
avatarAlt: "Michael C. avatar",
|
||||
id: "2", value: "4.9", title: "Average Rating", description: "From thousands of satisfied riders.", icon: Star
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily R.",
|
||||
date: "3 weeks ago",
|
||||
title: "Safe and Convenient",
|
||||
quote: "As a student, safety is my top priority. BookMyRide's features give me peace of mind, especially when traveling late at night.",
|
||||
tag: "Student Rider",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-smiling-middl-1774242855069-c4c66ff7.png",
|
||||
avatarAlt: "Emily R. avatar",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David K.",
|
||||
date: "1 month ago",
|
||||
title: "Great Value for Money",
|
||||
quote: "I'm always impressed by the affordable fares and quality of service. BookMyRide offers excellent value without compromising on comfort.",
|
||||
tag: "Value Seeker",
|
||||
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/professional-headshot-of-a-thoughtful-yo-1774242855507-be4b1113.png",
|
||||
avatarAlt: "David K. avatar",
|
||||
id: "3", value: "100+", title: "Cities Served", description: "Expanding our network daily.", icon: MapPin
|
||||
},
|
||||
]}
|
||||
title="What Our Riders Say: Trusted by Thousands"
|
||||
description="Hear directly from our satisfied customers about their BookMyRide experiences."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Payment Solutions",
|
||||
"Logistics Tech",
|
||||
"Automotive Innovation",
|
||||
"Urban Mobility",
|
||||
"Data & Analytics",
|
||||
"Smart City",
|
||||
"Venture Capital",
|
||||
]}
|
||||
logos={[
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-stylized-abstract-logo-for-a-fictional-1774242855868-a94c7307.png",
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-clean-geometric-logo-for-a-global-logi-1774242856408-f8f53abe.png",
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-sleek-minimalist-logo-for-a-major-auto-1774242854749-5bf7b837.png",
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-dynamic-abstract-logo-for-an-urban-pla-1774242855427-d2d1e82a.png",
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-clean-professional-logo-for-a-data-ana-1774242855522-b08942b9.png",
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-modern-bold-logo-for-a-smart-city-tech-1774242854431-13316309.png",
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-sleek-and-minimal-logo-for-a-venture-c-1774242855151-b86b19cf.png",
|
||||
]}
|
||||
title="Our Partners: Powering Your Journey"
|
||||
description="We collaborate with industry leaders to ensure the best experience, from secure payments to reliable vehicles."
|
||||
speed={30}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How do I book a ride?",
|
||||
content: "Simply open the BookMyRide app, enter your destination, choose your ride type, and confirm. A driver will be assigned shortly.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "What payment methods are accepted?",
|
||||
content: "We accept various payment methods including credit/debit cards, digital wallets, and cash, depending on your region.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Can I schedule a ride in advance?",
|
||||
content: "Yes, you can schedule a ride for a later time or date using the 'Schedule Ride' option in the app.",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "Is BookMyRide available 24/7?",
|
||||
content: "Yes, our services and customer support are available 24 hours a day, 7 days a week.",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "How are drivers screened?",
|
||||
content: "All our drivers undergo a rigorous background check, vehicle inspection, and regular performance evaluations to ensure your safety.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions: Get Your Answers Here"
|
||||
description="Find quick answers to the most common questions about BookMyRide's services."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "downward-rays-static",
|
||||
}}
|
||||
text="Ready to Ride? Book Your First Trip Now!"
|
||||
buttons={[
|
||||
{
|
||||
text: "Get the App",
|
||||
href: "/book-ride",
|
||||
},
|
||||
{
|
||||
text: "Contact Support",
|
||||
href: "/contact",
|
||||
},
|
||||
title="Ready to Ride? Get in Touch!"
|
||||
description="Have questions or need support? Fill out the form below and we'll get back to you shortly."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Your Message", rows: 4, required: true }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-futuristic-ride-sharing-app-interface--1774242857229-5c166130.png?_wi=1"
|
||||
imageAlt="BookMyRide app interface"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="BookMyRide"
|
||||
<FooterMedia
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-futuristic-ride-sharing-app-interface--1774242857229-5c166130.png?_wi=1"
|
||||
imageAlt="BookMyRide app interface"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "/about",
|
||||
},
|
||||
label: "About Us", href: "/about"},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
label: "Careers", href: "#"},
|
||||
{
|
||||
label: "Blog",
|
||||
href: "#",
|
||||
},
|
||||
label: "Blog", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Book a Ride",
|
||||
href: "/book-ride",
|
||||
},
|
||||
label: "Book a Ride", href: "/book-ride"},
|
||||
{
|
||||
label: "How It Works",
|
||||
href: "/how-it-works",
|
||||
},
|
||||
label: "How It Works", href: "/#how-it-works"},
|
||||
{
|
||||
label: "Ride Types",
|
||||
href: "#",
|
||||
},
|
||||
label: "Ride Types", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Help Center",
|
||||
href: "/faq",
|
||||
},
|
||||
label: "Help Center", href: "/faq"},
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "/contact",
|
||||
},
|
||||
label: "Contact Us", href: "/#contact"},
|
||||
{
|
||||
label: "Safety Guidelines",
|
||||
href: "#",
|
||||
},
|
||||
label: "Safety Guidelines", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy Policy", href: "#"},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
label: "Terms of Service", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="BookMyRide"
|
||||
copyrightText="© 2024 BookMyRide. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
|
||||
107
src/app/pricing/page.tsx
Normal file
107
src/app/pricing/page.tsx
Normal file
@@ -0,0 +1,107 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
||||
import { Star } from "lucide-react";
|
||||
|
||||
export default function PricingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="compact"
|
||||
sizing="largeSmallSizeLargeTitles"
|
||||
background="floatingGradient"
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Home", id: "home", href: "/" },
|
||||
{ name: "Book a Ride", id: "book-ride", href: "/book-ride" },
|
||||
{ name: "How it Works", id: "how-it-works", href: "/#how-it-works" },
|
||||
{ name: "About Us", id: "about-us", href: "/about" },
|
||||
{ name: "Pricing", id: "pricing", href: "/pricing" },
|
||||
{ name: "Contact", id: "contact", href: "/#contact" }
|
||||
]}
|
||||
brandName="BookMyRide"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Flexible Pricing Plans for Every Rider"
|
||||
description="Choose the plan that best suits your travel frequency and needs."
|
||||
plans={[
|
||||
{
|
||||
id: "basic", name: "Basic", price: "$5/ride", buttons: [{ text: "Select Basic", href: "#" }],
|
||||
features: [
|
||||
"Standard Vehicles", "Real-time Tracking", "24/7 Support"],
|
||||
},
|
||||
{
|
||||
id: "premium", name: "Premium", price: "$10/ride", badge: "Popular", badgeIcon: Star,
|
||||
buttons: [{ text: "Select Premium", href: "#" }],
|
||||
features: [
|
||||
"Premium Vehicles", "Priority Support", "In-ride Entertainment", "Free Cancellations"],
|
||||
},
|
||||
{
|
||||
id: "business", name: "Business", price: "$15/ride", buttons: [{ text: "Select Business", href: "#" }],
|
||||
features: [
|
||||
"Executive Cars", "Dedicated Account Manager", "Expense Reports", "Flexible Booking"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BKff17coHlcXqmygbowlBlEBUI/a-futuristic-ride-sharing-app-interface--1774242857229-5c166130.png?_wi=1"
|
||||
imageAlt="BookMyRide app interface"
|
||||
columns={[
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "Blog", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Book a Ride", href: "/book-ride" },
|
||||
{ label: "How It Works", href: "/#how-it-works" },
|
||||
{ label: "Ride Types", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{ label: "Help Center", href: "/faq" },
|
||||
{ label: "Contact Us", href: "/#contact" },
|
||||
{ label: "Safety Guidelines", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="BookMyRide"
|
||||
copyrightText="© 2024 BookMyRide. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user