254 lines
12 KiB
TypeScript
254 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
|
|
import HeroLogoBillboardSplit from "@/components/sections/hero/HeroLogoBillboardSplit";
|
|
import MediaAbout from "@/components/sections/about/MediaAbout";
|
|
import FeatureCardSix from "@/components/sections/feature/FeatureCardSix";
|
|
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
|
|
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
|
|
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
|
|
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
|
import FooterBase from "@/components/sections/footer/FooterBase";
|
|
import { Award, CreditCard, Heart, Sparkles, TrendingUp, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumSmall"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="circleGradient"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Programs", id: "features" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "Members", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{ text: "Join Now", href: "contact" }}
|
|
brandName="FitClub"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboardSplit
|
|
logoText="FitClub"
|
|
description="Unleash your strength and transform your body at FitClub. Join hundreds of members achieving their fitness goals with state-of-the-art equipment, expert coaching, and an energetic community."
|
|
background={{ variant: "animated-grid" }}
|
|
buttons={[
|
|
{ text: "Start Your Journey", href: "contact" },
|
|
{ text: "View Programs", href: "features" }
|
|
]}
|
|
layoutOrder="default"
|
|
imageSrc="http://img.b2bpic.net/free-photo/attractive-sports-girl-performs-exercises-hips-buttocks-healthy-lifestyle_78826-3373.jpg"
|
|
imageAlt="Modern fitness gym facility with equipment"
|
|
frameStyle="browser"
|
|
mediaAnimation="blur-reveal"
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MediaAbout
|
|
title="Transform Your Fitness Journey"
|
|
description="FitClub is more than a gym—it's a lifestyle. Our certified trainers, cutting-edge equipment, and supportive community are designed to help you achieve your fitness goals faster. Whether you're a beginner or advanced athlete, we have the perfect program for you."
|
|
tag="About Us"
|
|
imageSrc="http://img.b2bpic.net/free-photo/athletic-young-man-maker-workout-morning_654080-517.jpg"
|
|
imageAlt="Professional trainer coaching session"
|
|
buttons={[
|
|
{ text: "Learn More", href: "features" },
|
|
{ text: "Get Started", href: "contact" }
|
|
]}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardSix
|
|
title="Our Programs"
|
|
description="Explore our diverse fitness programs designed to help you reach your goals"
|
|
tag="What We Offer"
|
|
tagIcon={Zap}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Cardio Training", description: "High-intensity cardio workouts using state-of-the-art equipment including treadmills, ellipticals, and rowing machines to boost your endurance.", imageSrc: "http://img.b2bpic.net/free-photo/woman-working-out-gym-with-medical-mask_23-2148762605.jpg", imageAlt: "Modern cardio equipment in fitness gym"
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Strength & Power", description: "Build muscle and increase strength with our comprehensive weightlifting program, featuring dumbbells, barbells, and specialized training equipment.", imageSrc: "http://img.b2bpic.net/free-photo/man-white-protection-suit-disinfecting-spraying-set-weights-equipment-stop-spreading-highly-contagious-corona-virus_342744-61.jpg", imageAlt: "Advanced weightlifting equipment setup"
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Group Fitness Classes", description: "Join energizing group classes including yoga, pilates, spinning, and aerobics led by certified instructors in our modern studio facilities.", imageSrc: "http://img.b2bpic.net/free-photo/young-adult-mother-doing-fitness-with-her-little-daughter_1153-4764.jpg", imageAlt: "Group fitness class in action"
|
|
}
|
|
]}
|
|
tagAnimation="slide-up"
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardTwo
|
|
title="Simple & Flexible Pricing"
|
|
description="Choose the membership plan that fits your lifestyle"
|
|
tag="Membership Plans"
|
|
tagIcon={CreditCard}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
plans={[
|
|
{
|
|
id: "1", badge: "Starter", badgeIcon: Zap,
|
|
price: "$29/mo", subtitle: "Perfect for beginners", buttons: [
|
|
{ text: "Get Started", href: "contact" },
|
|
{ text: "Learn More", href: "#" }
|
|
],
|
|
features: [
|
|
"Unlimited gym access", "Basic equipment access", "Monthly fitness assessment", "Access to app"
|
|
]
|
|
},
|
|
{
|
|
id: "2", badge: "Pro", badgeIcon: Sparkles,
|
|
price: "$59/mo", subtitle: "Most popular choice", buttons: [
|
|
{ text: "Get Started", href: "contact" },
|
|
{ text: "Learn More", href: "#" }
|
|
],
|
|
features: [
|
|
"Unlimited gym access", "Full equipment access", "2 personal training sessions", "Group class passes included", "Nutrition consultation"
|
|
]
|
|
},
|
|
{
|
|
id: "3", badge: "Elite", badgeIcon: Award,
|
|
price: "$99/mo", subtitle: "Maximum results guaranteed", buttons: [
|
|
{ text: "Get Started", href: "contact" },
|
|
{ text: "Learn More", href: "#" }
|
|
],
|
|
features: [
|
|
"Unlimited gym & facility access", "Premium equipment priority", "4 personal training sessions", "Unlimited group classes", "Nutrition & wellness coaching", "VIP lounge access"
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardSeven
|
|
title="Our Impact"
|
|
description="Join thousands of members who have transformed their lives"
|
|
tag="By The Numbers"
|
|
tagIcon={TrendingUp}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
animationType="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "5K+", title: "Active Members", items: [
|
|
"Growing community daily", "Average 4.8/5 star rating", "Supportive members worldwide"
|
|
]
|
|
},
|
|
{
|
|
id: "2", value: "150+", title: "Group Classes Weekly", items: [
|
|
"Expert instructors leading", "Diverse program types", "High energy atmosphere"
|
|
]
|
|
},
|
|
{
|
|
id: "3", value: "98%", title: "Member Satisfaction", items: [
|
|
"Excellent facilities", "Professional staff", "Results-driven approach"
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "James Mitchell", imageSrc: "http://img.b2bpic.net/free-photo/headshot-african-american-man-runner-resting-after-intensive-outdoor-training-workout_273609-1178.jpg", imageAlt: "James Mitchell - Member"
|
|
},
|
|
{
|
|
id: "2", name: "Sarah Johnson", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-fitness-woman-keeps-hand-waist-being-good-physical-shape-wears-red-top-turns-gaze-away-with-happy-smile-enjoys-spending-free-time-gym_273609-33738.jpg", imageAlt: "Sarah Johnson - Member"
|
|
},
|
|
{
|
|
id: "3", name: "Marcus Chen", imageSrc: "http://img.b2bpic.net/free-photo/male-athlete-celebrating-his-victory-race-track_23-2148162074.jpg", imageAlt: "Marcus Chen - Member"
|
|
},
|
|
{
|
|
id: "4", name: "Elena Rodriguez", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-sportive-girl-white-background_176420-5456.jpg", imageAlt: "Elena Rodriguez - Member"
|
|
}
|
|
]}
|
|
cardTitle="10,000+ members have transformed their fitness with FitClub"
|
|
cardTag="Success Stories"
|
|
cardTagIcon={Heart}
|
|
cardAnimation="blur-reveal"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
title="Join FitClub Today"
|
|
description="Ready to start your fitness transformation? Fill out the form below and our team will get back to you within 24 hours with membership options and available trial classes."
|
|
inputs={[
|
|
{ name: "firstName", type: "text", placeholder: "First Name", required: true },
|
|
{ name: "email", type: "email", placeholder: "Email Address", required: true },
|
|
{ name: "phone", type: "tel", placeholder: "Phone Number", required: true }
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder: "Tell us about your fitness goals...", rows: 5,
|
|
required: true
|
|
}}
|
|
useInvertedBackground={false}
|
|
imageSrc="http://img.b2bpic.net/free-photo/close-up-treadmill-console-with-settings_1262-2975.jpg"
|
|
imageAlt="Modern gym reception area"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
buttonText="Get Started"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
logoText="FitClub"
|
|
copyrightText="© 2025 FitClub. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Programs", items: [
|
|
{ label: "Cardio Training", href: "features" },
|
|
{ label: "Strength Training", href: "features" },
|
|
{ label: "Group Classes", href: "features" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "about" },
|
|
{ label: "Membership", href: "pricing" },
|
|
{ label: "Contact", href: "contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Cookie Policy", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|