282 lines
15 KiB
TypeScript
282 lines
15 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="none"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Features", id: "features"},
|
|
{
|
|
name: "Shop", id: "products"},
|
|
{
|
|
name: "Community", id: "testimonials"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="AutoDrive"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
title="Drive Your Passion"
|
|
description="The ultimate hub for performance enthusiasts to tune, race, and connect. Elevate your driving experience."
|
|
testimonials={[
|
|
{
|
|
name: "Alex R.", handle: "@alexdrives", testimonial: "This platform transformed how I upgrade my ride.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/effect-city-lights-night_23-2149338542.jpg?_wi=1", imageAlt: "sports car motion blur"},
|
|
{
|
|
name: "Sarah M.", handle: "@trackqueen", testimonial: "Best community for track data insights.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/various-work-tools-worktop_1170-1505.jpg?_wi=1", imageAlt: "sports car motion blur"},
|
|
{
|
|
name: "Kevin T.", handle: "@tunerkev", testimonial: "Performance metrics are absolutely spot on.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/car-steering-wheel-view-night-road-from-car-closeup_169016-50606.jpg?_wi=1", imageAlt: "sports car motion blur"},
|
|
{
|
|
name: "Elena V.", handle: "@elena_drifts", testimonial: "Professional tools for serious drivers.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/driver-checking-stock-market-his-phone-while-car_53876-98095.jpg?_wi=1", imageAlt: "sports car motion blur"},
|
|
{
|
|
name: "Mike J.", handle: "@mj_tuning", testimonial: "A must-have for every serious tuner.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-y2k-logo-template_23-2150544168.jpg?_wi=1", imageAlt: "sports car motion blur"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/effect-city-lights-night_23-2149338542.jpg?_wi=2"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/attractive-young-man-looking-out-car-window_23-2147937253.jpg", alt: "An attractive young man looking out of car window"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-man-close-up-hard-light_1321-497.jpg", alt: "portrait of a man. close-up of a hard light"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-upbeat-car-showroom-saleswoman-ready-assist-customers_482257-124030.jpg", alt: "Portrait of upbeat car showroom saleswoman ready to assist customers"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/young-handsome-man-wink-camera_23-2148289216.jpg", alt: "Young and handsome man wink for camera"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/woman-choosing-car-car-showroom_1303-31980.jpg", alt: "Woman choosing a car in a car showroom"},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text", text: "Precision Engineering"},
|
|
{
|
|
type: "text", text: "High-Speed Analytics"},
|
|
{
|
|
type: "text", text: "Real-Time Telemetry"},
|
|
{
|
|
type: "text", text: "Expert Tuning Maps"},
|
|
{
|
|
type: "text", text: "Advanced Diagnostics"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
useInvertedBackground={false}
|
|
title="Precision Engineering"
|
|
description="We specialize in high-performance automotive tuning solutions designed to push the limits of speed and reliability. Our experts analyze every component to ensure peak performance."
|
|
metrics={[
|
|
{
|
|
value: "500+", title: "Tuners Active"},
|
|
{
|
|
value: "15K", title: "Stats Analyzed"},
|
|
{
|
|
value: "24/7", title: "Support"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/various-work-tools-worktop_1170-1505.jpg?_wi=2"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardNine
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Real-time Telemetry", description: "Monitor speed, engine temp, and boost pressure effortlessly.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/car-steering-wheel-view-night-road-from-car-closeup_169016-50606.jpg?_wi=2"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/driver-checking-stock-market-his-phone-while-car_53876-98095.jpg?_wi=2"}
|
|
},
|
|
{
|
|
title: "Tuning Presets", description: "Quickly switch between pre-optimized maps for tracks or streets.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-fuel-level-gauge-vehicle_23-2150163674.jpg"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg"}
|
|
},
|
|
{
|
|
title: "Cloud Data Sync", description: "Save your performance logs securely in our cloud platform.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-fuel-level-gauge-vehicle_23-2150163672.jpg"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/car-volume-knob-multimedia-controller-auto-textured-adjustment-wheel_169016-68661.jpg"}
|
|
}
|
|
]}
|
|
showStepNumbers={true}
|
|
title="Advanced Performance Analytics"
|
|
description="Track your car's vital signs and monitor performance metrics in real-time with our advanced diagnostic dashboard."
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
names={[
|
|
"SpeedForce", "TurboTune", "AeroDynamics", "EngineHub", "TrackPro", "ShiftMasters", "PerformanceLab"]}
|
|
title="Trusted by Leaders"
|
|
description="Partnering with the world's most influential automotive performance companies."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardFourteen
|
|
useInvertedBackground={false}
|
|
title="Our Global Impact"
|
|
tag="Milestones"
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "1.2M", description: "Miles Tracked"},
|
|
{
|
|
id: "m2", value: "85K", description: "Engine Tunes"},
|
|
{
|
|
id: "m3", value: "99.9%", description: "Customer Satisfaction"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "p1", name: "Racing Rims V1", price: "$1,200", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/brand-new-big-variety-car-s-tyres-shelf-with-prices-store-warehouse_613910-17120.jpg"},
|
|
{
|
|
id: "p2", name: "Bucked Seats Pro", price: "$850", variant: "Racing", imageSrc: "http://img.b2bpic.net/free-photo/interior-direction-speed-panel-car_114579-4067.jpg"},
|
|
{
|
|
id: "p3", name: "Intake Kit S", price: "$450", variant: "Performance", imageSrc: "http://img.b2bpic.net/free-photo/female-mechanic-fixing-gear_1170-1422.jpg"},
|
|
{
|
|
id: "p4", name: "Titanium Exhaust", price: "$2,100", variant: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-checking-car_23-2150171230.jpg"},
|
|
{
|
|
id: "p5", name: "Suspension Kit Z", price: "$1,600", variant: "Racing", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-hydraulic-elements_23-2149333336.jpg"},
|
|
{
|
|
id: "p6", name: "Ceramic Coating", price: "$120", variant: "Care", imageSrc: "http://img.b2bpic.net/free-photo/view-travel-items-inside-car-ready-trip_23-2151078234.jpg"},
|
|
]}
|
|
title="Premium Performance Parts"
|
|
description="Upgrade your machine with our hand-picked selection of high-performance components."
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
plans={[
|
|
{
|
|
id: "plan-basic", badge: "Standard", price: "$99", subtitle: "For daily drivers", features: [
|
|
"Basic Diagnostics", "Mobile Access", "Community Forum"],
|
|
buttons: [
|
|
{
|
|
text: "Get Started", href: "#"},
|
|
],
|
|
},
|
|
{
|
|
id: "plan-pro", badge: "Pro", price: "$299", subtitle: "For enthusiasts", features: [
|
|
"Advanced Tuning", "Track Logging", "Priority Support"],
|
|
buttons: [
|
|
{
|
|
text: "Get Started", href: "#"},
|
|
],
|
|
},
|
|
{
|
|
id: "plan-ultimate", badge: "Ultimate", price: "$599", subtitle: "For track teams", features: [
|
|
"Dyno Analysis", "Team Management", "Real-Time Consulting"],
|
|
buttons: [
|
|
{
|
|
text: "Get Started", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
title="Choose Your Package"
|
|
description="Select the plan that matches your tuning needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFive
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1", name: "Sarah Johnson", date: "Oct 2023", title: "Pro Tuner", quote: "Incredible service, my track performance improved instantly.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-young-tourist-driving-car_23-2148357275.jpg", imageSrc: "http://img.b2bpic.net/free-photo/effect-city-lights-night_23-2149338542.jpg?_wi=3", imageAlt: "happy man professional portrait"},
|
|
{
|
|
id: "t2", name: "Michael Chen", date: "Nov 2023", title: "Car Enthusiast", quote: "The performance analytics tool is unmatched in the industry.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-happy-woman-standing-by-car-street-young-pretty-caucasain-woman-standing-car-with-opened-door_657921-612.jpg", imageSrc: "http://img.b2bpic.net/free-photo/various-work-tools-worktop_1170-1505.jpg?_wi=3", imageAlt: "happy man professional portrait"},
|
|
{
|
|
id: "t3", name: "Emily Rodriguez", date: "Dec 2023", title: "Track Day Fan", quote: "High quality parts that actually deliver results on track.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/man-buying-car-showroom_1303-14589.jpg", imageSrc: "http://img.b2bpic.net/free-photo/car-steering-wheel-view-night-road-from-car-closeup_169016-50606.jpg?_wi=3", imageAlt: "happy man professional portrait"},
|
|
{
|
|
id: "t4", name: "David Kim", date: "Jan 2024", title: "Garage Owner", quote: "Reliable parts and great support, highly recommend.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-confident-male-electrician-standing-against-wall_23-2148087578.jpg", imageSrc: "http://img.b2bpic.net/free-photo/driver-checking-stock-market-his-phone-while-car_53876-98095.jpg?_wi=3", imageAlt: "happy man professional portrait"},
|
|
{
|
|
id: "t5", name: "Jessica Lee", date: "Feb 2024", title: "Performance Hobbyist", quote: "The community insights helped me tune my engine perfectly.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-motorcycle-helmet_23-2151574333.jpg", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-y2k-logo-template_23-2150544168.jpg?_wi=2", imageAlt: "happy man professional portrait"},
|
|
]}
|
|
title="Community Voices"
|
|
description="What our passionate community members say about our products and services."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
text="Ready to take your automotive passion to the next level? Join the elite community today."
|
|
buttons={[
|
|
{
|
|
text: "Join Now", href: "#"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="AutoDrive"
|
|
copyrightText="© 2024 AutoDrive Community. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|