Update src/app/page.tsx

This commit is contained in:
2026-03-03 15:00:56 +00:00
parent 0d4efd2f9f
commit 390f052d43

View File

@@ -10,13 +10,12 @@ import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCar
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: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
];
@@ -56,24 +55,6 @@ const footerColumns = [
];
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"
@@ -131,7 +112,7 @@ export default function HomePage() {
<div id="metrics" data-section="metrics" className="w-full py-16">
<MetricCardOne
title="Why Choose Ignite Fitness Club"
title="Ignite Fitness Club by the Numbers"
description="Trust indicators backed by real numbers and quality service"
tag="Trust Indicators"
tagIcon={Shield}
@@ -210,84 +191,6 @@ export default function HomePage() {
/>
</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"