development/237d7bda-c430-440f-8dcb-74b9d2ee5611
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: development:version_1
Branches Tags
development:main development:version_4 development:version_3 development:version_2 development:version_1
..
compare: development:main
Branches Tags
development:main development:version_4 development:version_3 development:version_2 development:version_1

10 Commits
version_1 ... main

Author SHA1 Message Date
development
6bcdf68927 Merge version_4 into main 
Merge version_4 into main
 2025-12-28 07:48:55 +00:00
development
79791eba4c Update src/app/page.tsx 2025-12-28 07:48:50 +00:00
development
8a7580e14e Merge version_3 into main 
Merge version_3 into main
 2025-12-28 07:26:51 +00:00
development
1381fe6884 Update src/app/page.tsx 2025-12-28 07:26:47 +00:00
development
3df0cbf2ab Update src/app/layout.tsx 2025-12-28 07:26:46 +00:00
development
c842f16e7b Merge version_3 into main 
Merge version_3 into main
 2025-12-28 07:24:40 +00:00
development
332cb59c92 Update src/app/page.tsx 2025-12-28 07:24:36 +00:00
development
6252d6d954 Merge version_2 into main 
Merge version_2 into main
 2025-12-28 07:21:46 +00:00
development
ad153097b6 Update src/app/layout.tsx 2025-12-28 07:21:42 +00:00
development
a4f00053bf Update src/app/globals.css 2025-12-28 07:21:41 +00:00
3 changed files with 232 additions and 239 deletions
Expand all files Collapse all files

18
src/app/globals.css
View File

@@ -4,13 +4,13 @@
/* Base units */ /* Base units */
/* --vw is set by ThemeProvider */ /* --vw is set by ThemeProvider */
--background: #fff8f5;; --background: #080000;
--card: #fff0eb;; --card: #1e0d0d;
--foreground: #3d2c29;; --foreground: #ffe6e6;
--primary-cta: #e8a090;; --primary-cta: #ff7a7a;
--secondary-cta: #ffffff;; --secondary-cta: #1e0909;
--accent: #f5d5cc;; --accent: #7b4242;
--background-accent: #f0c4b8;; --background-accent: #65292c;
/* text sizing - set by ThemeProvider */ /* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
@@ -495,7 +495,7 @@ html {
body { body {
background-color: var(--background); background-color: var(--background);
color: var(--foreground); color: var(--foreground);
font-family: var(--font-merriweather), sans-serif; font-family: var(--font-inter), sans-serif;
position: relative; position: relative;
min-height: 100vh; min-height: 100vh;
overscroll-behavior: none; overscroll-behavior: none;
@@ -508,5 +508,5 @@ h3,
h4, h4,
h5, h5,
h6 { h6 {
font-family: var(--font-merriweather), sans-serif; font-family: var(--font-inter), sans-serif;
} }

20
src/app/layout.tsx
View File

@@ -1,13 +1,10 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import { Merriweather } 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 merriweather = Merriweather({ const inter = Inter({
variable: "--font-merriweather", variable: "--font-inter",
subsets: ["latin"], subsets: ["latin"],
weight: ["300", "400", "700", "900"],
}); });
export const metadata: Metadata = { export const metadata: Metadata = {
@@ -33,13 +30,9 @@ export default function RootLayout({
}>) { }>) {
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<ServiceWrapper> <body className={inter.variable}>
<body {children}
className={merriweather.variable}
>
<Tag />
{children}
<script <script
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: ` __html: `
@@ -1258,7 +1251,6 @@ export default function RootLayout({
}} }}
/> />
</body> </body>
</ServiceWrapper>
</html> </html>
); );
} }

433
src/app/page.tsx
View File

@@ -1,244 +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="relative">
<img src="asset://coach-headshot" alt="Professional football coach with championship experience and proven track record in elite athlete development" className="w-full h-auto rounded-lg shadow-lg" />
</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">
}, <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."
id: "2", </p>
nameTitle: "Sarah Williams, High School QB", <div className="font-semibold text-gray-900">Marcus Johnson, College Linebacker</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>
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766343323260-wmu2pum7.jpg", <div className="bg-white p-8 rounded-lg shadow-sm">
imageAlt: "Sarah Williams" <p className="text-gray-600 mb-6 italic">
}, "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."
{ </p>
id: "3", <div className="font-semibold text-gray-900">Sarah Williams, High School QB</div>
nameTitle: "David Martinez, Defensive Back", </div>
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.", <div className="bg-white p-8 rounded-lg shadow-sm">
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766906153408-yi08z378.jpg", <p className="text-gray-600 mb-6 italic">
imageAlt: "David Martinez" "The film analysis sessions alone were worth every penny. My interception rate doubled in one season."
}, </p>
{ <div className="font-semibold text-gray-900">David Martinez, Defensive Back</div>
id: "4", </div>
nameTitle: "Alex Thompson, Offensive Line Coach", <div className="bg-white p-8 rounded-lg shadow-sm">
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.", <p className="text-gray-600 mb-6 italic">
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766343318478-c9cpv6qm.jpg", "The improvement was remarkable. His technical knowledge combined with his ability to push players past their limits is truly special."
imageAlt: "Alex Thompson" </p>
} <div className="font-semibold text-gray-900">Alex Thompson, Offensive Line Coach</div>
]} </div>
/> </div>
</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>
); );
} }