238 lines
13 KiB
TypeScript
238 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
|
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import { Zap, User, TrendingUp, TrendingDown, Calendar, Star, Clock, Lightbulb, Sparkles, Video, CheckCircle, Dumbbell, Heart, Shield, MessageCircle, Instagram, Facebook, Linkedin } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="mediumLarge"
|
|
background="floatingGradient"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="inset-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
brandName="FitCoach"
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Results", id: "metrics" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
bottomLeftText="Fitness Excellence"
|
|
bottomRightText="hello@fitcoach.com"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
title="Transform Your Body, Transform Your Life"
|
|
description="Expert personal training designed for real results. Whether you're starting your fitness journey or pushing toward your peak, our science-backed methods deliver measurable transformation in 90 days."
|
|
tag="Personal Training Excellence"
|
|
tagIcon={Zap}
|
|
background={{ variant: "sparkles-gradient" }}
|
|
kpis={[
|
|
{ value: "500+", label: "Clients Transformed" },
|
|
{ value: "89%", label: "Goal Achievement Rate" },
|
|
{ value: "10+ yrs", label: "Industry Experience" }
|
|
]}
|
|
enableKpiAnimation={true}
|
|
imageSrc="https://img.b2bpic.net/free-photo/achievement-muscle-gym-man-active_1139-707.jpg"
|
|
imageAlt="Professional personal trainer demonstrating exercises"
|
|
imagePosition="right"
|
|
buttons={[
|
|
{ text: "Start Your Transformation", href: "#contact" },
|
|
{ text: "View Success Stories", href: "#testimonials" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
tag="About Your Coach"
|
|
tagIcon={User}
|
|
title="Certified personal trainer with a passion for helping clients achieve sustainable fitness results through evidence-based training programs and nutritional guidance"
|
|
useInvertedBackground="noInvert"
|
|
buttons={[
|
|
{ text: "Learn My Story", href: "#" },
|
|
{ text: "Book a Consultation", href: "#contact" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardOne
|
|
title="Proven Results That Speak for Themselves"
|
|
description="Track the real impact we've made in our clients' lives through measurable fitness achievements"
|
|
tag="Client Success Metrics"
|
|
tagIcon={TrendingUp}
|
|
gridVariant="uniform-all-items-equal"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "45 lbs", title: "Average Weight Loss", description: "Clients typically lose 45 lbs within their first 90-day program", icon: TrendingDown
|
|
},
|
|
{
|
|
id: "2", value: "15", title: "Sessions Per Month", description: "Personalized training sessions tailored to individual fitness goals", icon: Calendar
|
|
},
|
|
{
|
|
id: "3", value: "98%", title: "Client Satisfaction", description: "Rated 5-star by 98% of our active training clients", icon: Star
|
|
},
|
|
{
|
|
id: "4", value: "52 weeks", title: "Average Commitment", description: "Clients commit to transformation for sustained, lasting results", icon: Clock
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="training-approach" data-section="training-approach">
|
|
<FeatureCardSeven
|
|
title="Your Personalized Training Journey"
|
|
description="Follow a structured 4-step process designed to maximize your results and build sustainable fitness habits"
|
|
tag="Proven Method"
|
|
tagIcon={Lightbulb}
|
|
textboxLayout="default"
|
|
animationType="blur-reveal"
|
|
useInvertedBackground="noInvert"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Assessment & Goal Setting", description: "We start with a comprehensive fitness assessment, body composition analysis, and detailed goal consultation to understand your unique needs and create your personalized roadmap.", imageSrc: "https://img.b2bpic.net/free-photo/woman-gym-with-coach_1303-5545.jpg"
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Custom Training Program", description: "Your program is tailored to your fitness level, preferences, and schedule. Whether you prefer strength training, cardio, HIIT, or a hybrid approach, we design the perfect mix.", imageSrc: "https://img.b2bpic.net/free-photo/two-internationals-friends-is-engaged-gym_1157-32114.jpg"
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Nutrition & Lifestyle Coaching", description: "Training is only half the equation. We provide nutritional guidance and lifestyle coaching to ensure your results extend far beyond the gym.", imageSrc: "https://img.b2bpic.net/free-photo/healthy-menu-recipe-food-diet_53876-122837.jpg"
|
|
},
|
|
{
|
|
id: 4,
|
|
title: "Progress Tracking & Optimization", description: "Monthly progress assessments, real-time adjustments to your program, and continuous motivation to keep you on track toward your transformation goals.", imageSrc: "https://img.b2bpic.net/free-photo/fit-couple-sitting-floor-gym_23-2147949622.jpg"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureBento
|
|
title="Advanced Training Features"
|
|
description="Cutting-edge tools and methods that set our training programs apart from the rest"
|
|
tag="Premium Services"
|
|
tagIcon={Sparkles}
|
|
textboxLayout="default"
|
|
animationType="blur-reveal"
|
|
useInvertedBackground="noInvert"
|
|
carouselMode="buttons"
|
|
features={[
|
|
{
|
|
title: "Performance Analytics", description: "Track strength gains, cardio improvements, and body composition changes with detailed progress reports", bentoComponent: "line-chart"
|
|
},
|
|
{
|
|
title: "Form Correction Features", description: "Video form correction, real-time form feedback, and exercise demonstrations for perfect technique", bentoComponent: "3d-task-list", items: [
|
|
{ icon: Video, label: "Form Videos", time: "On-Demand" },
|
|
{ icon: CheckCircle, label: "Technique Check", time: "Per Session" },
|
|
{ icon: Zap, label: "Instant Feedback", time: "Real-Time" }
|
|
]
|
|
},
|
|
{
|
|
title: "Personalized Workout Plans", description: "AI-assisted program design that adapts to your fitness level and goals", bentoComponent: "orbiting-icons", centerIcon: Dumbbell,
|
|
items: [
|
|
{ icon: Heart, ring: 1 },
|
|
{ icon: Zap, ring: 2 },
|
|
{ icon: Shield, ring: 3 }
|
|
]
|
|
},
|
|
{
|
|
title: "24/7 Support Access", description: "Chat with your trainer anytime for quick questions, motivation, or form clarifications", bentoComponent: "chat", aiIcon: MessageCircle,
|
|
userIcon: User,
|
|
exchanges: [
|
|
{
|
|
userMessage: "Can you check my squat form?", aiResponse: "Send a video of your last set. I'll review it and provide detailed feedback on depth, knee position, and core engagement."
|
|
},
|
|
{
|
|
userMessage: "What should I eat post-workout?", aiResponse: "High protein and carbs within 30 minutes. I recommend 30g protein and complex carbs like oats or sweet potato for optimal recovery."
|
|
}
|
|
],
|
|
placeholder: "Ask your trainer..."
|
|
},
|
|
{
|
|
title: "Goal Milestone Tracking", description: "Celebrate every win with milestone-based achievement system and rewards", bentoComponent: "timeline", heading: "Your 90-Day Journey", subheading: "Track progress through key fitness milestones", items: [
|
|
{ label: "Week 1-4: Foundation", detail: "Build strength base and establish training consistency" },
|
|
{ label: "Week 5-8: Acceleration", detail: "Increase intensity and see noticeable body composition changes" },
|
|
{ label: "Week 9-12: Transformation", detail: "Achieve major goals and plan long-term maintenance strategy" }
|
|
],
|
|
completedLabel: "Completed"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
testimonial="Working with my trainer completely changed my approach to fitness. I went from never stepping foot in a gym to confidently lifting heavier than I ever thought possible. The personalized attention and nutritional guidance made all the difference in achieving results I thought were impossible."
|
|
rating={5}
|
|
author="Sarah Mitchell, Executive"
|
|
useInvertedBackground="noInvert"
|
|
avatars={[
|
|
{ src: "https://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg", alt: "Sarah Mitchell" },
|
|
{ src: "https://img.b2bpic.net/free-photo/portrait-smiley-business-woman_23-2148603029.jpg", alt: "Client 2" },
|
|
{ src: "https://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg", alt: "Client 3" },
|
|
{ src: "https://img.b2bpic.net/free-photo/happy-business-woman-white-shirt_23-2148095748.jpg", alt: "Client 4" },
|
|
{ src: "https://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg", alt: "Client 5" },
|
|
{ src: "https://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg", alt: "Client 6" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Ready to Transform?"
|
|
tagIcon={Zap}
|
|
title="Start Your 90-Day Transformation Today"
|
|
description="Join hundreds of clients who have achieved their fitness goals. Limited spots available for new clients. Subscribe to our newsletter for exclusive training tips, nutrition advice, and early access to program openings."
|
|
background={{ variant: "sparkles-gradient" }}
|
|
useInvertedBackground="noInvert"
|
|
imageSrc="https://img.b2bpic.net/free-photo/male-personal-trainer-helping-woman-working-with-heavy-dumbbells-gym_651396-1074.jpg"
|
|
imageAlt="Personal trainer working with client"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Your email address"
|
|
buttonText="Get Started"
|
|
termsText="By signing up, you'll receive exclusive fitness tips and program updates. We respect your privacy and never spam."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="FitCoach"
|
|
copyrightText="© 2025 FitCoach | Personal Training Excellence"
|
|
socialLinks={[
|
|
{ icon: Instagram, href: "https://instagram.com/fitcoach", ariaLabel: "Follow us on Instagram" },
|
|
{ icon: Facebook, href: "https://facebook.com/fitcoach", ariaLabel: "Follow us on Facebook" },
|
|
{ icon: Linkedin, href: "https://linkedin.com/company/fitcoach", ariaLabel: "Connect on LinkedIn" }
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |