Merge version_3 into main

Merge version_3 into main
This commit was merged in pull request #3.
This commit is contained in:
2025-12-28 07:26:51 +00:00
2 changed files with 220 additions and 230 deletions

View File

@@ -1,8 +1,6 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import { Inter } from "next/font/google"; import { Inter } from "next/font/google";
import "./globals.css"; import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const inter = Inter({ const inter = Inter({
variable: "--font-inter", variable: "--font-inter",
@@ -32,12 +30,8 @@ export default function RootLayout({
}>) { }>) {
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<ServiceWrapper> <body className={inter.variable}>
<body {children}
className={inter.variable}
>
<Tag />
{children}
<script <script
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
@@ -1257,7 +1251,6 @@ export default function RootLayout({
}} }}
/> />
</body> </body>
</ServiceWrapper>
</html> </html>
); );
} }

View File

@@ -1,248 +1,245 @@
"use client" "use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from "@/components/navbar/NavbarStyleMinimal";
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
import MediaSplitAbout from "@/components/sections/about/MediaSplitAbout";
import FeatureCardTwentyOne from "@/components/sections/feature/FeatureCardTwentyOne";
import MetricCardSix from "@/components/sections/metrics/MetricCardSix";
import TestimonialCardEleven from "@/components/sections/testimonial/TestimonialCardEleven";
import ContactInline from "@/components/sections/contact/ContactInline";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
export default function LandingPage() { export default function LandingPage() {
return ( return (
<ThemeProvider <div className="min-h-screen bg-gray-50">
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="sharp"
contentWidth="small"
sizing="largeSmallSizeLargeTitles"
background="noiseDiagonalGradient"
cardStyle="glass-elevated"
primaryButtonStyle="layered-depth"
secondaryButtonStyle="outline"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleMinimal <nav className="bg-white shadow-sm border-b">
brandName="Coach Elite" <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
button={{ <div className="flex justify-between items-center h-16">
text: "Book Consultation", <div className="flex-shrink-0">
href: "contact" <h1 className="text-xl font-bold text-gray-900">Coach Elite</h1>
}} </div>
/> <div className="hidden md:block">
<button className="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium">
Book Consultation
</button>
</div>
</div>
</div>
</nav>
</div> </div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboard <div className="bg-gradient-to-r from-blue-600 to-blue-800 text-white">
title="Transform Your Game" <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24">
description="Expert football coaching for athletes who want to dominate on the field. Build strength, strategy, and championship mentality." <div className="text-center">
tag="Elite Training" <div className="inline-block px-3 py-1 text-sm bg-blue-500 rounded-full mb-4">
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766343321067-31qd7cx0.jpg" Elite Training
imageAlt="Football training field" </div>
frameStyle="card" <h1 className="text-4xl md:text-6xl font-extrabold mb-6">
buttons={[ Transform Your Game
{ </h1>
text: "Start Your Journey", <p className="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">
href: "contact" Expert football coaching for athletes who want to dominate on the field. Build strength, strategy, and championship mentality.
}, </p>
{ <div className="space-x-4">
text: "Learn More", <button className="bg-white text-blue-600 px-8 py-3 rounded-md text-lg font-semibold hover:bg-gray-100">
href: "about" Start Your Journey
} </button>
]} <button className="border-2 border-white text-white px-8 py-3 rounded-md text-lg font-semibold hover:bg-white hover:text-blue-600">
/> Learn More
</button>
</div>
</div>
</div>
</div>
</div> </div>
<div id="about" data-section="about"> <div id="about" data-section="about">
<MediaSplitAbout <div className="py-24 bg-white">
title="Proven Coaching Excellence" <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
description="With 15+ years of experience developing elite athletes and championship teams, I bring strategic insight, technical expertise, and a commitment to unlocking your full potential. My coaching philosophy combines cutting-edge training methods with personalized mentorship to help you achieve results that matter." <div className="grid md:grid-cols-2 gap-12 items-center">
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140152452-p4x3ah4p.jpg" <div>
imageAlt="Professional football coach" <h2 className="text-3xl md:text-4xl font-extrabold text-gray-900 mb-6">
imagePosition="right" Proven Coaching Excellence
useInvertedBackground="noInvert" </h2>
buttons={[ <p className="text-lg text-gray-600 mb-8">
{ With 15+ years of experience developing elite athletes and championship teams, I bring strategic insight, technical expertise, and a commitment to unlocking your full potential. My coaching philosophy combines cutting-edge training methods with personalized mentorship to help you achieve results that matter.
text: "View Credentials", </p>
href: "#" <button className="bg-blue-600 hover:bg-blue-700 text-white px-6 py-3 rounded-md font-semibold">
} View Credentials
]} </button>
/> </div>
<div className="bg-gray-200 aspect-square rounded-lg flex items-center justify-center">
<span className="text-gray-500">Professional football coach</span>
</div>
</div>
</div>
</div>
</div> </div>
<div id="services" data-section="services"> <div id="services" data-section="services">
<FeatureCardTwentyOne <div className="py-24 bg-gray-50">
title="Coaching Services" <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
description="Specialized training programs designed for serious athletes ready to elevate their game." <div className="text-center mb-16">
tag="What We Offer" <div className="inline-block px-3 py-1 text-sm bg-blue-100 text-blue-600 rounded-full mb-4">
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766906152144-eq65i151.jpg" What We Offer
imageAlt="Football team training session" </div>
mediaPosition="left" <h2 className="text-3xl md:text-4xl font-extrabold text-gray-900 mb-6">
useInvertedBackground="noInvert" Coaching Services
accordionItems={[ </h2>
{ <p className="text-lg text-gray-600 max-w-2xl mx-auto">
id: "1", Specialized training programs designed for serious athletes ready to elevate their game.
title: "One-on-One Training", </p>
content: "Personalized coaching sessions focused on your specific strengths and areas for improvement. Customized workout plans, technique refinement, and mental conditioning for peak performance." </div>
}, <div className="grid md:grid-cols-2 gap-8">
{ <div className="space-y-4">
id: "2", <div className="bg-white p-6 rounded-lg shadow-sm">
title: "Team Development Programs", <h3 className="text-xl font-bold text-gray-900 mb-2">One-on-One Training</h3>
content: "Comprehensive team coaching including strategy sessions, group training, leadership development, and competitive preparation to build cohesive, winning teams." <p className="text-gray-600">Personalized coaching sessions focused on your specific strengths and areas for improvement.</p>
}, </div>
{ <div className="bg-white p-6 rounded-lg shadow-sm">
id: "3", <h3 className="text-xl font-bold text-gray-900 mb-2">Team Development Programs</h3>
title: "Performance Analysis", <p className="text-gray-600">Comprehensive team coaching including strategy sessions and leadership development.</p>
content: "Advanced video analysis, game film breakdown, and performance metrics tracking to identify patterns and optimize your tactical approach and decision-making." </div>
}, </div>
{ <div className="space-y-4">
id: "4", <div className="bg-white p-6 rounded-lg shadow-sm">
title: "Mental Coaching", <h3 className="text-xl font-bold text-gray-900 mb-2">Performance Analysis</h3>
content: "Build championship mentality through sports psychology, confidence training, pressure management, and goal-setting frameworks for consistent excellence." <p className="text-gray-600">Advanced video analysis and performance metrics tracking to optimize your approach.</p>
} </div>
]} <div className="bg-white p-6 rounded-lg shadow-sm">
/> <h3 className="text-xl font-bold text-gray-900 mb-2">Mental Coaching</h3>
<p className="text-gray-600">Build championship mentality through sports psychology and confidence training.</p>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<div id="metrics" data-section="metrics"> <div id="metrics" data-section="metrics">
<MetricCardSix <div className="py-24 bg-blue-600">
title="Track Record of Success" <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
description="Proven results speak louder than words" <div className="text-center mb-16">
textboxLayout="default" <h2 className="text-3xl md:text-4xl font-extrabold text-white mb-6">
useInvertedBackground="noInvert" Track Record of Success
animationType="slide-up" </h2>
gridVariant="uniform-all-items-equal" <p className="text-xl text-blue-100">
metrics={[ Proven results speak louder than words
{ </p>
id: "1", </div>
value: "150+", <div className="grid md:grid-cols-4 gap-8">
tag: "Athletes Trained", <div className="text-center">
title: "Dedicated players developed into elite competitors" <div className="text-4xl font-extrabold text-white mb-2">150+</div>
}, <div className="text-blue-200 font-semibold mb-1">Athletes Trained</div>
{ <div className="text-blue-100 text-sm">Dedicated players developed into elite competitors</div>
id: "2", </div>
value: "12", <div className="text-center">
tag: "Championships", <div className="text-4xl font-extrabold text-white mb-2">12</div>
title: "Team titles and victories under my coaching" <div className="text-blue-200 font-semibold mb-1">Championships</div>
}, <div className="text-blue-100 text-sm">Team titles and victories under my coaching</div>
{ </div>
id: "3", <div className="text-center">
value: "95%", <div className="text-4xl font-extrabold text-white mb-2">95%</div>
tag: "Success Rate", <div className="text-blue-200 font-semibold mb-1">Success Rate</div>
title: "Athletes achieving their performance goals" <div className="text-blue-100 text-sm">Athletes achieving their performance goals</div>
}, </div>
{ <div className="text-center">
id: "4", <div className="text-4xl font-extrabold text-white mb-2">15+</div>
value: "15+", <div className="text-blue-200 font-semibold mb-1">Years Experience</div>
tag: "Years Experience", <div className="text-blue-100 text-sm">Dedicated to coaching excellence</div>
title: "Dedicated to coaching excellence" </div>
} </div>
]} </div>
/> </div>
</div> </div>
<div id="testimonials" data-section="testimonials"> <div id="testimonials" data-section="testimonials">
<TestimonialCardEleven <div className="py-24 bg-gray-50">
title="What Athletes Say" <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
description="Real results from dedicated players who transformed their game" <div className="text-center mb-16">
textboxLayout="default" <h2 className="text-3xl md:text-4xl font-extrabold text-gray-900 mb-6">
useInvertedBackground="noInvert" What Athletes Say
testimonials={[ </h2>
{ <p className="text-lg text-gray-600">
id: "1", Real results from dedicated players who transformed their game
nameTitle: "Marcus Johnson, College Linebacker", </p>
quote: "Coach transformed not just my technique but my mindset. His strategic approach helped me earn a scholarship and become team captain. The personalized attention made all the difference.", </div>
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766343316837-jqzqc92s.jpg", <div className="grid md:grid-cols-2 gap-8">
imageAlt: "Marcus Johnson", <div className="bg-white p-8 rounded-lg shadow-sm">
testimonialClassName: "text-white" <p className="text-gray-600 mb-6 italic">
}, "Coach transformed not just my technique but my mindset. His strategic approach helped me earn a scholarship and become team captain."
{ </p>
id: "2", <div className="font-semibold text-gray-900">Marcus Johnson, College Linebacker</div>
nameTitle: "Sarah Williams, High School QB", </div>
quote: "As a female quarterback breaking barriers, having a coach who believes in you is everything. Coach's expertise and encouragement helped me throw 40 TDs this season. Grateful doesn't cover it.", <div className="bg-white p-8 rounded-lg shadow-sm">
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766343323260-wmu2pum7.jpg", <p className="text-gray-600 mb-6 italic">
imageAlt: "Sarah Williams", "As a female quarterback breaking barriers, having a coach who believes in you is everything. Coach's expertise helped me throw 40 TDs this season."
testimonialClassName: "text-white" </p>
}, <div className="font-semibold text-gray-900">Sarah Williams, High School QB</div>
{ </div>
id: "3", <div className="bg-white p-8 rounded-lg shadow-sm">
nameTitle: "David Martinez, Defensive Back", <p className="text-gray-600 mb-6 italic">
quote: "The film analysis sessions alone were worth every penny. Coach shows you exactly what you're doing wrong and how to fix it. My interception rate doubled in one season.", "The film analysis sessions alone were worth every penny. My interception rate doubled in one season."
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766906153408-yi08z378.jpg", </p>
imageAlt: "David Martinez", <div className="font-semibold text-gray-900">David Martinez, Defensive Back</div>
testimonialClassName: "text-white" </div>
}, <div className="bg-white p-8 rounded-lg shadow-sm">
{ <p className="text-gray-600 mb-6 italic">
id: "4", "The improvement was remarkable. His technical knowledge combined with his ability to push players past their limits is truly special."
nameTitle: "Alex Thompson, Offensive Line Coach", </p>
quote: "I brought Coach in to develop our O-line, and the improvement was remarkable. His technical knowledge combined with his ability to push players past their limits is truly special.", <div className="font-semibold text-gray-900">Alex Thompson, Offensive Line Coach</div>
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766343318478-c9cpv6qm.jpg", </div>
imageAlt: "Alex Thompson", </div>
testimonialClassName: "text-white" </div>
} </div>
]}
/>
</div> </div>
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactInline <div className="py-24 bg-blue-600">
text="Ready to elevate your game?" <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
inputPlaceholder="your@email.com" <h2 className="text-3xl md:text-4xl font-extrabold text-white mb-8">
buttonText="Get Started" Ready to elevate your game?
useInvertedBackground="noInvert" </h2>
animationType="entrance-slide" <div className="flex max-w-md mx-auto">
/> <input
type="email"
placeholder="your@email.com"
className="flex-1 px-4 py-3 rounded-l-md border-0 focus:ring-2 focus:ring-blue-500"
/>
<button className="bg-white text-blue-600 px-6 py-3 rounded-r-md font-semibold hover:bg-gray-100">
Get Started
</button>
</div>
</div>
</div>
</div> </div>
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterLogoEmphasis <div className="bg-gray-900 text-white py-16">
logoText="Coach Elite" <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
columns={[ <div className="grid md:grid-cols-4 gap-8">
{ <div>
items: [ <h3 className="text-xl font-bold mb-4">Coach Elite</h3>
{ </div>
label: "Services", <div>
href: "services" <h4 className="font-semibold mb-4">Services</h4>
}, <ul className="space-y-2 text-gray-300">
{ <li><a href="#services" className="hover:text-white">Services</a></li>
label: "About", <li><a href="#about" className="hover:text-white">About</a></li>
href: "about" <li><a href="#testimonials" className="hover:text-white">Testimonials</a></li>
}, </ul>
{ </div>
label: "Testimonials", <div>
href: "testimonials" <h4 className="font-semibold mb-4">Contact</h4>
} <ul className="space-y-2 text-gray-300">
] <li><a href="#contact" className="hover:text-white">Contact</a></li>
}, <li><a href="#contact" className="hover:text-white">Book Session</a></li>
{ </ul>
items: [ </div>
{ <div>
label: "Contact", <h4 className="font-semibold mb-4">Legal</h4>
href: "contact" <ul className="space-y-2 text-gray-300">
}, <li><a href="#" className="hover:text-white">Privacy Policy</a></li>
{ <li><a href="#" className="hover:text-white">Terms of Service</a></li>
label: "Book Session", </ul>
href: "contact" </div>
} </div>
] </div>
}, </div>
{
items: [
{
label: "Privacy Policy",
href: "#"
},
{
label: "Terms of Service",
href: "#"
}
]
}
]}
/>
</div> </div>
</ThemeProvider> </div>
); );
} }