370 lines
18 KiB
TypeScript
370 lines
18 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import Link from "next/link";
|
|
import { Sparkles, Shield, Zap, Users, Star, Clock, Heart, Award } from "lucide-react";
|
|
import { useState } from "react";
|
|
|
|
const navItems = [
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Services", id: "/services" },
|
|
{ name: "Membership", id: "/membership" },
|
|
{ name: "Assessment", id: "#fitness-assessment" },
|
|
{ name: "Contact", id: "/contact" },
|
|
];
|
|
|
|
const footerColumns = [
|
|
{
|
|
items: [
|
|
{ label: "Home", href: "/" },
|
|
{ label: "Services", href: "/services" },
|
|
{ label: "About Us", href: "/about" },
|
|
{ label: "Contact", href: "/contact" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Membership Plans", href: "/membership" },
|
|
{ label: "Personal Training", href: "/services" },
|
|
{ label: "Nutrition", href: "/services" },
|
|
{ label: "Testimonials", href: "/" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "📍 Location", href: "https://maps.google.com/?q=90+Feet+Road+Dharavi+Mumbai+400017" },
|
|
{ label: "📞 +91-XXXX-XXXXX", href: "tel:+919876543210" },
|
|
{ label: "📧 info@ignitefitness.com", href: "mailto:info@ignitefitness.com" },
|
|
{ label: "Open Till 12 AM", href: "/" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Privacy Policy", href: "/" },
|
|
{ label: "Terms & Conditions", href: "/" },
|
|
{ label: "Membership Agreement", href: "/" },
|
|
{ label: "FAQs", href: "/" },
|
|
],
|
|
},
|
|
];
|
|
|
|
export default function HomePage() {
|
|
const [weight, setWeight] = useState("");
|
|
const [fitnessGoal, setFitnessGoal] = useState("");
|
|
const [hoursPerWeek, setHoursPerWeek] = useState("");
|
|
const [assessmentComplete, setAssessmentComplete] = useState(false);
|
|
|
|
const handleSubmitAssessment = (e: React.FormEvent) => {
|
|
e.preventDefault();
|
|
if (weight && fitnessGoal && hoursPerWeek) {
|
|
setAssessmentComplete(true);
|
|
setTimeout(() => {
|
|
setAssessmentComplete(false);
|
|
setWeight("");
|
|
setFitnessGoal("");
|
|
setHoursPerWeek("");
|
|
}, 2000);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumSmall"
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
background="circleGradient"
|
|
cardStyle="outline"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={navItems.map((item) => ({
|
|
name: item.name,
|
|
id: item.id,
|
|
}))}
|
|
button={{ text: "Book Free Trial", href: "/contact" }}
|
|
brandName="Ignite Fitness Club"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero" className="w-full py-20">
|
|
<HeroBillboard
|
|
title="Dharavi's Premium Gym Experience"
|
|
description="New Equipment. Expert Trainers. Real Transformations. Join 500+ members who've transformed their fitness journey at Ignite Fitness Club."
|
|
background={{ variant: "sparkles-gradient" }}
|
|
tag="⭐ 5.0 Rating | 26+ Reviews"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "🔥 Book Free Trial", href: "/contact" },
|
|
{ text: "📞 Call Now", href: "tel:+919876543210" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="http://img.b2bpic.net/free-photo/sport-fitness-health-exercise-bikes-fitness-center_613910-20283.jpg?_wi=1"
|
|
imageAlt="Ignite Fitness Club premium gym interior with modern equipment"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/young-adult-doing-indoor-sport-gym_23-2149205542.jpg", alt: "Certified trainer"
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-gym_23-2149049763.jpg", alt: "Happy member"
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/afro-american-sportsman-getting-ready-training_342744-655.jpg", alt: "Transformed member"
|
|
},
|
|
]}
|
|
avatarText="Trusted by 500+ fitness enthusiasts in Dharavi"
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics" className="w-full py-16">
|
|
<MetricCardOne
|
|
title="Why Choose Ignite Fitness Club"
|
|
description="Trust indicators backed by real numbers and quality service"
|
|
tag="Trust Indicators"
|
|
tagIcon={Shield}
|
|
tagAnimation="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "500", title: "Active Members", description: "Growing fitness community in Dharavi", icon: Users,
|
|
},
|
|
{
|
|
id: "2", value: "26", title: "5-Star Reviews", description: "Premium gym experience verified", icon: Star,
|
|
},
|
|
{
|
|
id: "3", value: "100%", title: "New Equipment", description: "Latest fitness technology available", icon: Zap,
|
|
},
|
|
{
|
|
id: "4", value: "12", title: "Open Till Midnight", description: "Flexible training hours for professionals", icon: Clock,
|
|
},
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features" className="w-full py-20">
|
|
<FeatureCardSeven
|
|
title="Complete Fitness Solutions"
|
|
description="Everything you need to achieve your fitness goals in one premium facility"
|
|
tag="Our Services"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Weight Training", description:
|
|
"State-of-the-art strength training equipment with personalized guidance from certified trainers. Build muscle and increase power.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/still-life-gym-equipment_23-2148197736.jpg?_wi=1"
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Cardio Excellence", description:
|
|
"Premium cardio machines including treadmills, ellipticals, and rowing machines. Improve endurance and heart health.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/young-woman-gym-fitnes_624325-2383.jpg?_wi=1"
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Personal Training", description:
|
|
"One-on-one coaching with certified fitness professionals. Customized workout plans tailored to your goals.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/young-sports-people-training-morning-gym_1157-32133.jpg?_wi=1"
|
|
},
|
|
{
|
|
id: 4,
|
|
title: "Fitness Testing", description:
|
|
"Comprehensive fitness assessments and body composition analysis. Track progress with scientific precision.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/female-athlete-doing-physical-effort-stepper-doctor-follows-her-sports-laboratory_482257-31674.jpg"
|
|
},
|
|
{
|
|
id: 5,
|
|
title: "Nutrition Counseling", description:
|
|
"Expert nutrition guidance and meal planning. Achieve your fitness goals with the right dietary support.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/healthy-menu-recipe-food-diet_53876-122837.jpg"
|
|
},
|
|
]}
|
|
textboxLayout="default"
|
|
animationType="blur-reveal"
|
|
buttons={[{ text: "Learn More", href: "/services" }]}
|
|
buttonAnimation="slide-up"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about" className="w-full py-16">
|
|
<TestimonialAboutCard
|
|
tag="Premium Experience"
|
|
tagIcon={Award}
|
|
tagAnimation="slide-up"
|
|
title="Quality Crowd. Energetic Environment. Real Results."
|
|
description="Rahul Sharma"
|
|
subdescription="Member since 2023 | Body Transformation Athlete"
|
|
icon={Heart}
|
|
imageSrc="http://img.b2bpic.net/free-photo/slim-sexy-blonde-young-sportswoman-with-athletic-body-pumped-press-poses-gym-looking-camera-black-sportswear-full-length-portrait_7502-8729.jpg"
|
|
imageAlt="Member transformation success story"
|
|
mediaAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="fitness-assessment" data-section="fitness-assessment" className="w-full py-20">
|
|
<div className="mx-auto max-w-4xl px-6">
|
|
<div className="mb-12 text-center">
|
|
<h2 className="mb-4 text-4xl font-bold md:text-5xl">Personalized Fitness Assessment</h2>
|
|
<p className="text-lg text-foreground/80">Let us understand your fitness goals and create a personalized plan for you</p>
|
|
</div>
|
|
|
|
<div className="mx-auto max-w-2xl rounded-lg bg-card p-8 shadow-lg">
|
|
{assessmentComplete ? (
|
|
<div className="text-center">
|
|
<div className="mb-4 text-5xl">✅</div>
|
|
<h3 className="mb-2 text-2xl font-bold text-primary-cta">Assessment Submitted!</h3>
|
|
<p className="text-foreground/80">Thank you for completing your fitness assessment. Our trainers will review your information and reach out soon with a personalized plan.</p>
|
|
</div>
|
|
) : (
|
|
<form onSubmit={handleSubmitAssessment} className="space-y-6">
|
|
<div>
|
|
<label className="mb-2 block text-sm font-semibold text-foreground">
|
|
Current Weight (kg)
|
|
</label>
|
|
<input
|
|
type="number"
|
|
step="0.1"
|
|
placeholder="Enter your weight"
|
|
value={weight}
|
|
onChange={(e) => setWeight(e.target.value)}
|
|
className="w-full rounded-lg border border-accent bg-background px-4 py-3 text-foreground placeholder-foreground/50 focus:border-primary-cta focus:outline-none"
|
|
required
|
|
/>
|
|
</div>
|
|
|
|
<div>
|
|
<label className="mb-2 block text-sm font-semibold text-foreground">
|
|
Fitness Goal
|
|
</label>
|
|
<select
|
|
value={fitnessGoal}
|
|
onChange={(e) => setFitnessGoal(e.target.value)}
|
|
className="w-full rounded-lg border border-accent bg-background px-4 py-3 text-foreground focus:border-primary-cta focus:outline-none"
|
|
required
|
|
>
|
|
<option value="">Select your primary goal</option>
|
|
<option value="weight-loss">Weight Loss</option>
|
|
<option value="muscle-gain">Muscle Gain</option>
|
|
<option value="strength">Build Strength</option>
|
|
<option value="endurance">Improve Endurance</option>
|
|
<option value="general-fitness">General Fitness</option>
|
|
<option value="flexibility">Increase Flexibility</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div>
|
|
<label className="mb-2 block text-sm font-semibold text-foreground">
|
|
Hours Devoted to Fitness Per Week
|
|
</label>
|
|
<input
|
|
type="number"
|
|
step="0.5"
|
|
placeholder="e.g., 3.5"
|
|
value={hoursPerWeek}
|
|
onChange={(e) => setHoursPerWeek(e.target.value)}
|
|
className="w-full rounded-lg border border-accent bg-background px-4 py-3 text-foreground placeholder-foreground/50 focus:border-primary-cta focus:outline-none"
|
|
required
|
|
/>
|
|
</div>
|
|
|
|
<button
|
|
type="submit"
|
|
className="w-full rounded-lg bg-primary-cta px-6 py-3 font-semibold text-primary-cta-text transition-all hover:opacity-90"
|
|
>
|
|
Submit Assessment
|
|
</button>
|
|
</form>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials" className="w-full py-20">
|
|
<TestimonialCardTen
|
|
title="Testimonials from Our Community"
|
|
description="Real transformations from real members of Ignite Fitness Club"
|
|
tag="Member Success Stories"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
testimonials={[
|
|
{
|
|
id: "1", title: "Lost 15kg in 3 Months", quote:
|
|
"The trainers at IFC are incredibly motivating. They designed a perfect plan for my weight loss journey and I saw results within weeks. The clean environment and quality crowd kept me motivated throughout.", name: "Priya Desai", role: "Marketing Executive", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/portrait-smiling-successful-businesswoman-looking-into-camera-sitting-restaurant-business-lady-with-stylish-hairstyle-wears-elegant-suit-business-meeting-attractive-appearance_8353-12611.jpg", imageAlt: "Priya Desai transformation"
|
|
},
|
|
{
|
|
id: "2", title: "Built Muscle & Confidence", quote:
|
|
"As a beginner, I was intimidated. But the certified trainers made me feel comfortable and guided me through every step. The quality of equipment and people here is unmatched in Dharavi.", name: "Arjun Patel", role: "Software Developer", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/brutal-muscular-male-with-crossed-arms-dressed-blue-t-shirt-grey-background_613910-10043.jpg", imageAlt: "Arjun Patel muscle building journey"
|
|
},
|
|
{
|
|
id: "3", title: "Perfect Balance of Fitness", quote:
|
|
"I love the 24-hour access and flexible timings. The nutrition counseling helped me understand the science behind fitness. IFC is not just a gym, it's a complete wellness center.", name: "Anjali Verma", role: "Entrepreneur", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/close-up-successful-entrepreneur_1098-3855.jpg", imageAlt: "Anjali Verma fitness journey"
|
|
},
|
|
{
|
|
id: "4", title: "Best Investment I Made", quote:
|
|
"Six months at IFC completely changed my lifestyle. The trainers pushed me to my limits in the best way possible. The community vibe is energetic and supportive.", name: "Vikram Singh", role: "Banker", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg", imageAlt: "Vikram Singh fitness transformation"
|
|
},
|
|
{
|
|
id: "5", title: "Exceeded All Expectations", quote:
|
|
"Coming from a fancy Mumbai gym, I was skeptical. But IFC has premium equipment, expert trainers, and genuine members. The pricing is unbeatable for the quality offered.", name: "Neha Kapoor", role: "HR Manager", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg", imageAlt: "Neha Kapoor premium gym experience"
|
|
},
|
|
{
|
|
id: "6", title: "Consistent Results", quote:
|
|
"The structured programs and professional coaching made all the difference. I transformed from sedentary to athletic in just one year. Highly recommend IFC to anyone serious about fitness.", name: "Rohan Gupta", role: "Business Analyst", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/handsome-groom-classy-black-suit-stands-dark-room_8353-7083.jpg", imageAlt: "Rohan Gupta fitness achievement"
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="cta-section" data-section="cta-section" className="w-full py-20">
|
|
<HeroBillboard
|
|
title="Start Your Fitness Transformation Today"
|
|
description="Book your free fitness assessment and consultation. Limited membership slots available this month. Join 500+ members already transforming their lives."
|
|
background={{ variant: "animated-grid" }}
|
|
tag="Limited Time Offer"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "📝 Get Free Trial Form", href: "/contact" },
|
|
{ text: "☎️ Call Now - +91-XXXX-XXXXX", href: "tel:+919876543210" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer" className="w-full py-12">
|
|
<FooterLogoEmphasis
|
|
columns={footerColumns}
|
|
logoText="Ignite Fitness Club"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|