233 lines
12 KiB
TypeScript
233 lines
12 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
||
import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll";
|
||
import TextAbout from "@/components/sections/about/TextAbout";
|
||
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
||
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
|
||
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
||
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
|
||
import { Bike, Heart, Wrench, Star, Smile } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="hover-bubble"
|
||
defaultTextAnimation="reveal-blur"
|
||
borderRadius="pill"
|
||
contentWidth="mediumLarge"
|
||
sizing="largeSmallSizeLargeTitles"
|
||
background="noise"
|
||
cardStyle="gradient-bordered"
|
||
primaryButtonStyle="diagonal-gradient"
|
||
secondaryButtonStyle="layered"
|
||
headingFontWeight="bold"
|
||
>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingOverlay
|
||
brandName="Bike Way"
|
||
navItems={[
|
||
{ name: "About", id: "about" },
|
||
{ name: "Services", id: "services" },
|
||
{ name: "Why Us", id: "testimonials" },
|
||
{ name: "Contact", id: "contact" }
|
||
]}
|
||
button={{ text: "Book a Service", href: "#contact" }}
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroBillboardScroll
|
||
title="Ride Better. Ride Further. Ride With Confidence."
|
||
description="From first ride to pro-level performance — we help you find the perfect bike, keep it running flawlessly, and enjoy every moment on the road or trail."
|
||
background={{ variant: "radial-gradient" }}
|
||
tag="Jerusalem's Premier Bicycle Experience"
|
||
tagIcon={Bike}
|
||
tagAnimation="slide-up"
|
||
buttons={[
|
||
{ text: "Shop Bikes", href: "#services" },
|
||
{ text: "Book a Service", href: "#contact" },
|
||
{ text: "Rent a Bike", href: "#contact" }
|
||
]}
|
||
buttonAnimation="blur-reveal"
|
||
imageSrc="http://img.b2bpic.net/free-photo/bearded-man-with-bicycle_1098-1289.jpg"
|
||
imageAlt="Modern bicycle shop interior with welcoming atmosphere"
|
||
ariaLabel="Bike Way hero section"
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TextAbout
|
||
tag="Built by Riders. Trusted by Riders."
|
||
tagIcon={Heart}
|
||
tagAnimation="slide-up"
|
||
title="Bike Way isn't just a bike shop — it's a place where passion meets precision."
|
||
buttons={[
|
||
{ text: "Learn More About Our Expertise", href: "#services" }
|
||
]}
|
||
buttonAnimation="blur-reveal"
|
||
useInvertedBackground={false}
|
||
ariaLabel="About Bike Way section"
|
||
/>
|
||
</div>
|
||
|
||
<div id="services" data-section="services">
|
||
<FeatureCardMedia
|
||
title="Our Services"
|
||
description="Everything you need for your cycling journey, delivered with expertise and genuine care."
|
||
tag="Comprehensive Cycling Solutions"
|
||
tagIcon={Wrench}
|
||
tagAnimation="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
animationType="blur-reveal"
|
||
features={[
|
||
{
|
||
id: "bike-sales", title: "Bike Sales", description: "Carefully curated selection of top-quality bikes for road cycling, mountain biking, gravel & hybrid riding, and family bikes. We help you test, compare, and find your perfect match — no rush.", tag: "Expert Selection", imageSrc: "http://img.b2bpic.net/free-photo/close-up-rear-wheel-vintage-bicycle_23-2148696765.jpg", imageAlt: "Premium bicycles on display in shop"
|
||
},
|
||
{
|
||
id: "repairs", title: "Repairs & Maintenance", description: "Fast, professional service from experienced mechanics. From quick fixes to full rebuilds: gear tuning, brake adjustments, wheel repairs, and full servicing. Most jobs completed quickly.", tag: "Professional Mechanics", imageSrc: "http://img.b2bpic.net/free-photo/mechanic-repairing-bicycle-wheel_1170-2441.jpg", imageAlt: "Expert mechanic performing bicycle maintenance"
|
||
},
|
||
{
|
||
id: "rentals", title: "Bike Rentals", description: "Explore Jerusalem on two wheels. High-quality, well-maintained bikes with flexible rental periods and local route recommendations. Perfect for visitors and locals alike.", tag: "Flexible Rentals", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-with-bicycle-nature_23-2149727771.jpg", imageAlt: "Quality bicycles ready for rent"
|
||
},
|
||
{
|
||
id: "fitting", title: "Personalized Fitting & Advice", description: "Not sure what you need? We guide you through bike sizing, riding style, budget considerations, and accessories that actually matter. Your perfect bike awaits.", tag: "Expert Guidance", imageSrc: "http://img.b2bpic.net/free-photo/adjusting-handlebar-height_1098-15539.jpg", imageAlt: "Professional bike fitting consultation session"
|
||
}
|
||
]}
|
||
ariaLabel="Bike Way services section"
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardSixteen
|
||
title="Why Customers Love Us"
|
||
description="Real riders, real experiences. Join hundreds of satisfied cyclists who trust Bike Way."
|
||
tag="Community Trust"
|
||
tagIcon={Star}
|
||
tagAnimation="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
animationType="blur-reveal"
|
||
kpiItems={[
|
||
{ value: "4.6★", label: "Customer Rating" },
|
||
{ value: "500+", label: "Happy Riders" },
|
||
{ value: "10+", label: "Years of Excellence" }
|
||
]}
|
||
testimonials={[
|
||
{
|
||
id: "1", name: "Sarah Cohen", role: "Urban Commuter", company: "Jerusalem Cyclists", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg"
|
||
},
|
||
{
|
||
id: "2", name: "David Levi", role: "Weekend Rider", company: "Trail Enthusiasts", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/happy-beautiful-black-haired-lady-standing-city-park-looking-away-smiling-woman-posing-outdoors-summer-closeup-shot-female-portrait-concept_74855-12818.jpg"
|
||
},
|
||
{
|
||
id: "3", name: "Miriam Rosenberg", role: "First-Time Buyer", company: "Community Member", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1602.jpg"
|
||
},
|
||
{
|
||
id: "4", name: "Yosef Ben-David", role: "Serious Enthusiast", company: "Cycling Club", rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-outdoors_23-2150188348.jpg"
|
||
}
|
||
]}
|
||
ariaLabel="Customer testimonials section"
|
||
/>
|
||
</div>
|
||
|
||
<div id="experience" data-section="experience">
|
||
<TextAbout
|
||
tag="The Bike Way Experience"
|
||
tagIcon={Smile}
|
||
tagAnimation="slide-up"
|
||
title="We believe buying or fixing a bike should feel simple, enjoyable, and even exciting."
|
||
buttons={[
|
||
{ text: "Visit Us Today", href: "#contact" }
|
||
]}
|
||
buttonAnimation="blur-reveal"
|
||
useInvertedBackground={true}
|
||
ariaLabel="Experience section"
|
||
/>
|
||
</div>
|
||
|
||
<div id="location" data-section="location">
|
||
<ContactSplitForm
|
||
title="Location & Hours"
|
||
description="Visit us in the heart of Jerusalem. We're here to help with expert advice, quality bikes, and professional service."
|
||
imageSrc="http://img.b2bpic.net/free-photo/adult-with-synthetic-leather-clothing_23-2149431036.jpg"
|
||
imageAlt="Bike Way shop location in Jerusalem"
|
||
mediaAnimation="slide-up"
|
||
mediaPosition="right"
|
||
useInvertedBackground={false}
|
||
inputs={[
|
||
{ name: "address", type: "text", placeholder: "Shatner Center, off Beit Ha-Defus, Jerusalem, Israel", required: false },
|
||
{ name: "phone", type: "tel", placeholder: "+972-2-652-5256", required: false }
|
||
]}
|
||
textarea={{ name: "hours", placeholder: "Sunday–Thursday: 9:30–18:30\nFriday: 9:00–14:00\nSaturday: Closed", rows: 4, required: false }}
|
||
buttonText="Get Directions"
|
||
ariaLabel="Location and hours information"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplitForm
|
||
title="Ready to Ride?"
|
||
description="Whether you're buying your first bike or upgrading to your dream ride — we're here to help. Get in touch with our team today."
|
||
imageSrc="http://img.b2bpic.net/free-photo/bearded-man-with-bicycle_1098-1289.jpg"
|
||
imageAlt="Bike Way team ready to help"
|
||
mediaAnimation="slide-up"
|
||
mediaPosition="left"
|
||
useInvertedBackground={false}
|
||
inputs={[
|
||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||
{ name: "email", type: "email", placeholder: "your@email.com", required: true },
|
||
{ name: "phone", type: "tel", placeholder: "+972-...", required: false }
|
||
]}
|
||
textarea={{ name: "message", placeholder: "Tell us what you need help with...", rows: 5, required: true }}
|
||
buttonText="Send Message"
|
||
ariaLabel="Contact form section"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterBaseCard
|
||
logoText="Bike Way"
|
||
copyrightText="© 2025 Bike Way | Ride smarter. Ride better. Ride with people who care."
|
||
columns={[
|
||
{
|
||
title: "Shop", items: [
|
||
{ label: "Bikes", href: "#services" },
|
||
{ label: "Rentals", href: "#services" },
|
||
{ label: "Accessories", href: "#contact" }
|
||
]
|
||
},
|
||
{
|
||
title: "Services", items: [
|
||
{ label: "Repairs", href: "#services" },
|
||
{ label: "Maintenance", href: "#services" },
|
||
{ label: "Fitting", href: "#services" }
|
||
]
|
||
},
|
||
{
|
||
title: "Company", items: [
|
||
{ label: "About Us", href: "#about" },
|
||
{ label: "Contact", href: "#contact" },
|
||
{ label: "Location", href: "#location" }
|
||
]
|
||
},
|
||
{
|
||
title: "Connect", items: [
|
||
{ label: "Email: bikewayshop@gmail.com", href: "mailto:bikewayshop@gmail.com" },
|
||
{ label: "Phone: +972-2-652-5256", href: "tel:+972-2-652-5256" },
|
||
{ label: "Privacy Policy", href: "#" }
|
||
]
|
||
}
|
||
]}
|
||
ariaLabel="Site footer"
|
||
/>
|
||
</div>
|
||
</ThemeProvider>
|
||
);
|
||
} |