Update src/app/page.tsx
This commit is contained in:
370
src/app/page.tsx
370
src/app/page.tsx
@@ -17,271 +17,127 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Subscription",
|
||||
id: "pricing",
|
||||
},
|
||||
{
|
||||
name: "Support",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Arrive"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Subscription", id: "pricing" },
|
||||
{ name: "Support", id: "contact" },
|
||||
]}
|
||||
brandName="Arrive"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Drive More. Keep Everything."
|
||||
description="Arrive is the first subscription-based rideshare platform that puts the power back in your hands. Keep 100% of your earnings, every single ride."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Free Trial",
|
||||
href: "#pricing",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg?_wi=1",
|
||||
imageAlt: "Arrive Driver Dashboard",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg?_wi=2",
|
||||
imageAlt: "Arrive Driver Dashboard Analytics",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg?_wi=3",
|
||||
imageAlt: "Earnings Overview",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg?_wi=4",
|
||||
imageAlt: "Real-time Profit Tracking",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg?_wi=5",
|
||||
imageAlt: "Subscription Management",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Drive More. Keep Everything."
|
||||
description="Arrive is the first subscription-based rideshare platform that puts the power back in your hands. Keep 100% of your earnings, every single ride."
|
||||
buttons={[{ text: "Start Free Trial", href: "#pricing" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg", imageAlt: "Arrive Driver Dashboard" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg", imageAlt: "Arrive Driver Dashboard Analytics" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg", imageAlt: "Earnings Overview" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg", imageAlt: "Real-time Profit Tracking" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg", imageAlt: "Subscription Management" },
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Keep 100% of Fares",
|
||||
description: "Forget hidden commission percentages. With a simple flat monthly subscription, every dollar you earn is yours to keep.",
|
||||
icon: Shield,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/recycle-sign-with-dollar-sign-green-black_78370-9145.jpg?_wi=1",
|
||||
imageAlt: "Earnings retention icon",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/recycle-sign-with-dollar-sign-green-black_78370-9145.jpg?_wi=2",
|
||||
imageAlt: "Secure payments",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-steering-wheel-navigator-car-night_169016-51407.jpg?_wi=6",
|
||||
imageAlt: "rideshare dashboard interface",
|
||||
},
|
||||
{
|
||||
title: "Real-time Tracking",
|
||||
description: "Navigate smarter with our advanced driver dashboard, featuring precision routing and instant payment updates.",
|
||||
icon: Navigation,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2149270100.jpg?_wi=1",
|
||||
imageAlt: "Tracking dashboard",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2149270100.jpg?_wi=2",
|
||||
imageAlt: "Navigation UI",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/recycle-sign-with-dollar-sign-green-black_78370-9145.jpg?_wi=3",
|
||||
imageAlt: "financial growth icon",
|
||||
},
|
||||
]}
|
||||
title="Designed for the Modern Driver"
|
||||
description="We've removed the middleman commissions to ensure you retain your hard-earned income."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Keep 100% of Fares", description: "Forget hidden commission percentages. With a simple flat monthly subscription, every dollar you earn is yours to keep.", icon: Shield,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/recycle-sign-with-dollar-sign-green-black_78370-9145.jpg", imageAlt: "Earnings retention icon" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/recycle-sign-with-dollar-sign-green-black_78370-9145.jpg", imageAlt: "Secure payments" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Real-time Tracking", description: "Navigate smarter with our advanced driver dashboard, featuring precision routing and instant payment updates.", icon: Navigation,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2149270100.jpg", imageAlt: "Tracking dashboard" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2149270100.jpg", imageAlt: "Navigation UI" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Designed for the Modern Driver"
|
||||
description="We've removed the middleman commissions to ensure you retain your hard-earned income."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "pro-monthly",
|
||||
tag: "Most Popular",
|
||||
price: "$49",
|
||||
period: "/month",
|
||||
description: "Unlimited access to our 0% commission platform. Earn more, stress less.",
|
||||
button: {
|
||||
text: "Activate Pro",
|
||||
href: "#",
|
||||
},
|
||||
featuresTitle: "Pro Benefits",
|
||||
features: [
|
||||
"100% Fare Retention",
|
||||
"Instant Daily Payouts",
|
||||
"Priority Support",
|
||||
"Advanced Routing",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "trial-plan",
|
||||
tag: "Free Trial",
|
||||
price: "$0",
|
||||
period: "/7 days",
|
||||
description: "See for yourself how much more you earn. No commitment required.",
|
||||
button: {
|
||||
text: "Start Trial",
|
||||
href: "#",
|
||||
},
|
||||
featuresTitle: "Included",
|
||||
features: [
|
||||
"7 Days Full Access",
|
||||
"100% Fare Retention",
|
||||
"Instant Payouts",
|
||||
"No Upfront Cost",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Transparent Subscription"
|
||||
description="Choose the plan that fits your driving schedule."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "pro-monthly", tag: "Most Popular", price: "$49", period: "/month", description: "Unlimited access to our 0% commission platform. Earn more, stress less.", button: { text: "Activate Pro", href: "#" },
|
||||
featuresTitle: "Pro Benefits", features: ["100% Fare Retention", "Instant Daily Payouts", "Priority Support", "Advanced Routing"],
|
||||
},
|
||||
{
|
||||
id: "trial-plan", tag: "Free Trial", price: "$0", period: "/7 days", description: "See for yourself how much more you earn. No commitment required.", button: { text: "Start Trial", href: "#" },
|
||||
featuresTitle: "Included", features: ["7 Days Full Access", "100% Fare Retention", "Instant Payouts", "No Upfront Cost"],
|
||||
},
|
||||
]}
|
||||
title="Transparent Subscription"
|
||||
description="Choose the plan that fits your driving schedule."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
role: "Full-time Driver",
|
||||
company: "Arrive Pro",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-choosing-car-car-showroom_1303-21765.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark D.",
|
||||
role: "Part-time Driver",
|
||||
company: "Arrive Pro",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/travel-adventure-active-lifestyle-concept-stylish-young-man-snapback-sitting-inside-his-white-vehicle_273609-1591.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena M.",
|
||||
role: "Driver",
|
||||
company: "Arrive Pro",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-mood-driving-car-reverse-gear-looking-man-his-brand-new-automobile_146671-14447.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David L.",
|
||||
role: "Driver",
|
||||
company: "Arrive Pro",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-fashionable-young-unshaven-man-wearing-cap-backwards-sitting-inside-his-jeep-looking-road-while-parking-his-four-wheel-drive-car_273609-1592.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Jessica K.",
|
||||
role: "Driver",
|
||||
company: "Arrive Pro",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/saleswoman-car-showroom-selling-cars_1303-25484.jpg",
|
||||
},
|
||||
]}
|
||||
title="Loved by Drivers Everywhere"
|
||||
description="Hear what our community of professional drivers has to say about their earnings with Arrive."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah J.", role: "Full-time Driver", company: "Arrive Pro", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-man-choosing-car-car-showroom_1303-21765.jpg" },
|
||||
{ id: "2", name: "Mark D.", role: "Part-time Driver", company: "Arrive Pro", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/travel-adventure-active-lifestyle-concept-stylish-young-man-snapback-sitting-inside-his-white-vehicle_273609-1591.jpg" },
|
||||
{ id: "3", name: "Elena M.", role: "Driver", company: "Arrive Pro", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/cheerful-mood-driving-car-reverse-gear-looking-man-his-brand-new-automobile_146671-14447.jpg" },
|
||||
{ id: "4", name: "David L.", role: "Driver", company: "Arrive Pro", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-fashionable-young-unshaven-man-wearing-cap-backwards-sitting-inside-his-jeep-looking-road-while-parking-his-four-wheel-drive-car_273609-1592.jpg" },
|
||||
{ id: "5", name: "Jessica K.", role: "Driver", company: "Arrive Pro", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/saleswoman-car-showroom-selling-cars_1303-25484.jpg" },
|
||||
]}
|
||||
title="Loved by Drivers Everywhere"
|
||||
description="Hear what our community of professional drivers has to say about their earnings with Arrive."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
tag="Ready to Drive?"
|
||||
title="Join the Arrive Platform Today"
|
||||
description="Sign up now and start keeping 100% of your earnings. Our team is ready to support your success."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#pricing",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Ready to Drive?"
|
||||
title="Join the Arrive Platform Today"
|
||||
description="Sign up now and start keeping 100% of your earnings. Our team is ready to support your success."
|
||||
buttons={[{ text: "Get Started", href: "#pricing" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Features",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Support",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Arrive"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{ items: [{ label: "About", href: "#" }, { label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }] },
|
||||
{ items: [{ label: "Support", href: "#" }, { label: "Terms", href: "#" }, { label: "Privacy", href: "#" }] },
|
||||
]}
|
||||
logoText="Arrive"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user