Initial commit

This commit is contained in:
Nikolay Pecheniev
2026-02-05 11:12:38 +02:00
commit 4618b1f1ff
645 changed files with 77464 additions and 0 deletions

146
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,146 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import CustomNavbar from "@/components/navbar/CustomNavbar";
import AboutTeam from "@/components/about/AboutTeam";
import AchievementsMetrics from "@/components/metric/AchievementsMetrics";
import FooterSection from "@/components/footer/FooterSection";
import { Users, Trophy, Globe, Award } from "lucide-react";
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<CustomNavbar
logo="BvB Young"
links={[
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" },
{ label: "Contact", href: "/contact" }
]}
/>
</div>
<div id="about" data-section="about" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<AboutTeam
title="About BvB Young Football Academy"
description="Founded with a passion for excellence, BvB Young represents the pinnacle of youth football development. Our academy combines traditional football values with modern training methodologies to create an environment where young talents can flourish. We believe that football is more than just a game - it's a pathway to character building, teamwork, and personal growth."
features={[
{
title: "Elite Coaching Staff",
description: "Our coaching team consists of former professional players and certified UEFA coaches who bring years of experience and expertise to our training programs."
},
{
title: "World-Class Facilities",
description: "State-of-the-art training grounds featuring multiple pitches, indoor facilities, fitness centers, and recovery suites designed for optimal player development."
},
{
title: "Comprehensive Development",
description: "We focus on technical skills, tactical understanding, physical conditioning, and mental strength to prepare players for the highest levels of competition."
},
{
title: "International Exposure",
description: "Regular participation in prestigious tournaments across Europe provides our players with invaluable competitive experience against top international talent."
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="metrics" data-section="metrics" className="mx-auto px-4 md:px-6">
<AchievementsMetrics
title="Our Track Record"
description="Numbers that speak to our commitment to excellence and player development"
metrics={[
{
label: "Academy Graduates",
value: "150+",
icon: Users
},
{
label: "Championships Won",
value: "28",
icon: Trophy
},
{
label: "International Players",
value: "45",
icon: Globe
},
{
label: "Years of Excellence",
value: "15",
icon: Award
}
]}
useInvertedBackground="invertDefault"
/>
</div>
<div id="mission" data-section="mission" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<div className="max-w-4xl mx-auto text-center">
<h2 className="text-3xl md:text-4xl lg:text-5xl font-medium mb-6">Our Mission & Values</h2>
<p className="text-lg md:text-xl text-foreground/80 mb-12">
At BvB Young, we are committed to developing not just exceptional footballers, but exceptional individuals. Our values guide everything we do.
</p>
<div className="grid md:grid-cols-3 gap-8">
<div className="p-6 rounded-lg bg-card/50">
<h3 className="text-xl font-semibold mb-4">Excellence</h3>
<p className="text-foreground/70">Striving for the highest standards in everything we do, from training to competition to personal conduct.</p>
</div>
<div className="p-6 rounded-lg bg-card/50">
<h3 className="text-xl font-semibold mb-4">Integrity</h3>
<p className="text-foreground/70">Building character through honest, ethical behavior both on and off the pitch.</p>
</div>
<div className="p-6 rounded-lg bg-card/50">
<h3 className="text-xl font-semibold mb-4">Innovation</h3>
<p className="text-foreground/70">Continuously evolving our methods and embracing new technologies to stay at the forefront of player development.</p>
</div>
</div>
</div>
</div>
<FooterSection
companyName="BvB Young"
description="Developing the next generation of football champions"
sections={[
{
title: "Quick Links",
links: [
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" }
]
},
{
title: "Contact",
links: [
{ label: "Email: info@bvbyoung.com", href: "mailto:info@bvbyoung.com" },
{ label: "Phone: +49 231 1234567", href: "tel:+4923112345567" }
]
}
]}
socialLinks={[
{ platform: "facebook", url: "https://facebook.com/bvbyoung" },
{ platform: "instagram", url: "https://instagram.com/bvbyoung" },
{ platform: "twitter", url: "https://twitter.com/bvbyoung" }
]}
copyright="© 2024 BvB Young. All rights reserved."
/>
</ThemeProvider>
);
}

89
src/app/blog/page.tsx Normal file
View File

@@ -0,0 +1,89 @@
"use client";
import ReactLenis from "lenis/react";
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import FooterSection from '@/components/sections/footer/FooterSection';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import CustomNavbar from '@/components/navbar/CustomNavbar';
import { useBlogPosts } from "@/hooks/useBlogPosts";
export default function BlogPage() {
const { posts, isLoading } = useBlogPosts();
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<div className="min-h-screen bg-background">
<CustomNavbar
logo="BvB Young"
links={[
{"label":"Home","href":"/"},
{"label":"About","href":"/about"},
{"label":"Players","href":"/players"},
{"label":"News","href":"/news"},
{"label":"Contact","href":"/contact"}
]}
navItems={[
{"name":"Home","id":"/"}
]}
/>
{isLoading ? (
<div className="w-content-width mx-auto py-20 text-center">
<p className="text-foreground">Loading posts...</p>
</div>
) : (
<BlogCardOne
blogs={posts}
title="Latest News & Updates"
description="Stay updated with the latest news from BvB Young academy"
textboxLayout="default"
useInvertedBackground="noInvert"
carouselMode="buttons"
animationType="slide-up"
tag="News"
/>
)}
<FooterSection
companyName="BvB Young"
description="Developing the next generation of football champions"
sections={[
{
"title":"Quick Links", "links":[
{"label":"Home","href":"/"},
{"label":"About","href":"/about"},
{"label":"Players","href":"/players"},
{"label":"News","href":"/news"}
]
},
{
"title":"Contact", "links":[
{"label":"Email: info@bvbyoung.com","href":"mailto:info@bvbyoung.com"},
{"label":"Phone: +49 231 1234567","href":"tel:+4923112345567"}
]
}
]}
socialLinks={[
{"platform":"facebook","url":"https://facebook.com/bvbyoung"},
{"platform":"instagram","url":"https://instagram.com/bvbyoung"},
{"platform":"twitter","url":"https://twitter.com/bvbyoung"}
]}
copyright="© 2024 BvB Young. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

153
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,153 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import CustomNavbar from "@/components/navbar/CustomNavbar";
import ContactSection from "@/components/contact/ContactSection";
import FooterSection from "@/components/footer/FooterSection";
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<CustomNavbar
logo="BvB Young"
links={[
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" },
{ label: "Contact", href: "/contact" }
]}
/>
</div>
<div id="contact" data-section="contact" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<ContactSection
title="Get In Touch"
description="Interested in joining BvB Young or have questions about our academy? We'd love to hear from you. Contact us today to learn more about our programs and how we can help develop your football potential."
contactInfo={{
email: "info@bvbyoung.com",
phone: "+49 231 1234567",
address: "Dortmund, Germany"
}}
formFields={[
{
name: "fullName",
label: "Full Name",
type: "text",
required: true
},
{
name: "email",
label: "Email Address",
type: "email",
required: true
},
{
name: "subject",
label: "Subject",
type: "text",
required: true
},
{
name: "message",
label: "Message",
type: "textarea",
required: true
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="location" data-section="location" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<div className="max-w-4xl mx-auto text-center">
<h2 className="text-3xl md:text-4xl lg:text-5xl font-medium mb-6">Visit Our Academy</h2>
<p className="text-lg md:text-xl text-foreground/80 mb-12">
Located in the heart of Dortmund, our academy offers world-class facilities and easy accessibility for families throughout the region.
</p>
<div className="grid md:grid-cols-2 gap-8">
<div className="p-6 rounded-lg bg-card/50 text-left">
<h3 className="text-xl font-semibold mb-4">Academy Address</h3>
<p className="text-foreground/70 mb-2">BvB Young Football Academy</p>
<p className="text-foreground/70 mb-2">Trainingsgelände Süd</p>
<p className="text-foreground/70 mb-2">44139 Dortmund, Germany</p>
<p className="text-foreground/70">Near Signal Iduna Park</p>
</div>
<div className="p-6 rounded-lg bg-card/50 text-left">
<h3 className="text-xl font-semibold mb-4">Getting Here</h3>
<p className="text-foreground/70 mb-2">By Car: A40 Exit Dortmund-Süd</p>
<p className="text-foreground/70 mb-2">By Train: Dortmund Hauptbahnhof + Bus 440</p>
<p className="text-foreground/70 mb-2">By Bus: Lines 440, 445 to "Stadion"</p>
<p className="text-foreground/70">Parking available on-site</p>
</div>
</div>
</div>
</div>
<div id="faq" data-section="faq" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<div className="max-w-4xl mx-auto">
<h2 className="text-3xl md:text-4xl lg:text-5xl font-medium text-center mb-12">Frequently Asked Questions</h2>
<div className="space-y-6">
<div className="p-6 rounded-lg bg-card/50">
<h3 className="text-xl font-semibold mb-3">What age groups do you accept?</h3>
<p className="text-foreground/70">We accept players from ages 8 to 18, with specialized programs for each age group focusing on age-appropriate development.</p>
</div>
<div className="p-6 rounded-lg bg-card/50">
<h3 className="text-xl font-semibold mb-3">How do I apply for the academy?</h3>
<p className="text-foreground/70">Contact us to schedule a trial session. We evaluate players based on skill level, attitude, and potential for development.</p>
</div>
<div className="p-6 rounded-lg bg-card/50">
<h3 className="text-xl font-semibold mb-3">What does the training program include?</h3>
<p className="text-foreground/70">Our comprehensive program includes technical training, tactical education, physical conditioning, mental preparation, and match experience.</p>
</div>
<div className="p-6 rounded-lg bg-card/50">
<h3 className="text-xl font-semibold mb-3">Do you offer scholarships?</h3>
<p className="text-foreground/70">Yes, we offer scholarship opportunities for exceptional talents who demonstrate both skill and dedication but may need financial assistance.</p>
</div>
</div>
</div>
</div>
<FooterSection
companyName="BvB Young"
description="Developing the next generation of football champions"
sections={[
{
title: "Quick Links",
links: [
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" }
]
},
{
title: "Contact",
links: [
{ label: "Email: info@bvbyoung.com", href: "mailto:info@bvbyoung.com" },
{ label: "Phone: +49 231 1234567", href: "tel:+4923112345567" }
]
}
]}
socialLinks={[
{ platform: "facebook", url: "https://facebook.com/bvbyoung" },
{ platform: "instagram", url: "https://instagram.com/bvbyoung" },
{ platform: "twitter", url: "https://twitter.com/bvbyoung" }
]}
copyright="© 2024 BvB Young. All rights reserved."
/>
</ThemeProvider>
);
}

BIN
src/app/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

600
src/app/globals.css Normal file
View File

@@ -0,0 +1,600 @@
@import "tailwindcss";
:root {
/* Base units */
/* --vw is set by ThemeProvider */
/* --background: #0a0a0a;;
--card: #1a1a1a;;
--foreground: #ffffffe6;;
--primary-cta: #e6e6e6;;
--secondary-cta: #1a1a1a;;
--accent: #737373;;
--background-accent: #737373;; */
--background: #0a0a0a;;
--card: #1a1a1a;;
--foreground: #ffffffe6;;
--primary-cta: #e6e6e6;;
--secondary-cta: #1a1a1a;;
--accent: #737373;;
--background-accent: #737373;;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
--text-xs: clamp(0.54rem, 0.72vw, 0.72rem);
--text-sm: clamp(0.615rem, 0.82vw, 0.82rem);
--text-base: clamp(0.69rem, 0.92vw, 0.92rem);
--text-lg: clamp(0.75rem, 1vw, 1rem);
--text-xl: clamp(0.825rem, 1.1vw, 1.1rem);
--text-2xl: clamp(0.975rem, 1.3vw, 1.3rem);
--text-3xl: clamp(1.2rem, 1.6vw, 1.6rem);
--text-4xl: clamp(1.5rem, 2vw, 2rem);
--text-5xl: clamp(2.025rem, 2.75vw, 2.75rem);
--text-6xl: clamp(2.475rem, 3.3vw, 3.3rem);
--text-7xl: clamp(3rem, 4vw, 4rem);
--text-8xl: clamp(3.5rem, 4.5vw, 4.5rem);
--text-9xl: clamp(5.25rem, 7vw, 7rem); */
/* Base spacing units */
--vw-0_25: calc(var(--vw) * 0.25);
--vw-0_5: calc(var(--vw) * 0.5);
--vw-0_625: calc(var(--vw) * 0.625);
--vw-0_75: calc(var(--vw) * 0.75);
--vw-1: calc(var(--vw) * 1);
--vw-1_25: calc(var(--vw) * 1.25);
--vw-1_5: calc(var(--vw) * 1.5);
--vw-1_75: calc(var(--vw) * 1.75);
--vw-2: calc(var(--vw) * 2);
--vw-2_25: calc(var(--vw) * 2.25);
--vw-2_5: calc(var(--vw) * 2.5);
--vw-2_75: calc(var(--vw) * 2.75);
--vw-3: calc(var(--vw) * 3);
/* width */
--width-5: clamp(4rem, 5vw, 6rem);
--width-7_5: clamp(5.625rem, 7.5vw, 7.5rem);
--width-10: clamp(7.5rem, 10vw, 10rem);
--width-12_5: clamp(9.375rem, 12.5vw, 12.5rem);
--width-15: clamp(11.25rem, 15vw, 15rem);
--width-17: clamp(12.75rem, 17vw, 17rem);
--width-17_5: clamp(13.125rem, 17.5vw, 17.5rem);
--width-20: clamp(15rem, 20vw, 20rem);
--width-21: clamp(15.75rem, 21vw, 21rem);
--width-22_5: clamp(16.875rem, 22.5vw, 22.5rem);
--width-25: clamp(18.75rem, 25vw, 25rem);
--width-26: clamp(19.5rem, 26vw, 26rem);
--width-27_5: clamp(20.625rem, 27.5vw, 27.5rem);
--width-30: clamp(22.5rem, 30vw, 30rem);
--width-32_5: clamp(24.375rem, 32.5vw, 32.5rem);
--width-35: clamp(26.25rem, 35vw, 35rem);
--width-37_5: clamp(28.125rem, 37.5vw, 37.5rem);
--width-40: clamp(30rem, 40vw, 40rem);
--width-42_5: clamp(31.875rem, 42.5vw, 42.5rem);
--width-45: clamp(33.75rem, 45vw, 45rem);
--width-47_5: clamp(35.625rem, 47.5vw, 47.5rem);
--width-50: clamp(37.5rem, 50vw, 50rem);
--width-52_5: clamp(39.375rem, 52.5vw, 52.5rem);
--width-55: clamp(41.25rem, 55vw, 55rem);
--width-57_5: clamp(43.125rem, 57.5vw, 57.5rem);
--width-60: clamp(45rem, 60vw, 60rem);
--width-62_5: clamp(46.875rem, 62.5vw, 62.5rem);
--width-65: clamp(48.75rem, 65vw, 65rem);
--width-67_5: clamp(50.625rem, 67.5vw, 67.5rem);
--width-70: clamp(52.5rem, 70vw, 70rem);
--width-72_5: clamp(54.375rem, 72.5vw, 72.5rem);
--width-75: clamp(56.25rem, 75vw, 75rem);
--width-77_5: clamp(58.125rem, 77.5vw, 77.5rem);
--width-80: clamp(60rem, 80vw, 80rem);
--width-82_5: clamp(61.875rem, 82.5vw, 82.5rem);
--width-85: clamp(63.75rem, 85vw, 85rem);
--width-87_5: clamp(65.625rem, 87.5vw, 87.5rem);
--width-90: clamp(67.5rem, 90vw, 90rem);
--width-92_5: clamp(69.375rem, 92.5vw, 92.5rem);
--width-95: clamp(71.25rem, 95vw, 95rem);
--width-97_5: clamp(73.125rem, 97.5vw, 97.5rem);
--width-100: clamp(75rem, 100vw, 100rem);
/* --width-content-width and --width-content-width-expanded are set by ThemeProvider */
--width-carousel-padding: calc((100vw - var(--width-content-width)) / 2 + 1px - var(--vw-1_5));
--width-carousel-padding-controls: calc((100vw - var(--width-content-width)) / 2 + 1px);
--width-carousel-padding-expanded: calc((var(--width-content-width-expanded) - var(--width-content-width)) / 2 + 1px - var(--vw-1_5));
--width-carousel-padding-controls-expanded: calc((var(--width-content-width-expanded) - var(--width-content-width)) / 2 + 1px);
--width-carousel-item-3: calc(var(--width-content-width) / 3 - var(--vw-1_5) / 3 * 2);
--width-carousel-item-4: calc(var(--width-content-width) / 4 - var(--vw-1_5) / 4 * 3);
--width-x-padding-mask-fade: clamp(1.5rem, 4vw, 4rem);
--height-4: 1rem;
--height-5: 1.25rem;
--height-6: 1.5rem;
--height-7: 1.75rem;
--height-8: 2rem;
--height-9: 2.25rem;
--height-10: 2.5rem;
--height-11: 2.75rem;
--height-12: 3rem;
--height-30: 7.5rem;
--height-90: 22.5rem;
--height-100: 25rem;
--height-110: 27.5rem;
--height-120: 30rem;
--height-130: 32.5rem;
--height-140: 35rem;
--height-150: 37.5rem;
/* hero page padding */
--padding-hero-page-padding-half: calc((var(--height-10) + var(--vw-1_5) + var(--vw-1_5) + var(--height-10)) / 2);
--padding-hero-page-padding: calc(var(--height-10) + var(--vw-1_5) + var(--vw-1_5) + var(--height-10));
--padding-hero-page-padding-1_5: calc(1.5 * (var(--height-10) + var(--vw-1_5) + var(--vw-1_5) + var(--height-10)));
--padding-hero-page-padding-double: calc(2 * (var(--height-10) + var(--vw-1_5) + var(--vw-1_5) + var(--height-10)));
}
@media (max-width: 767px) {
:root {
/* --vw and text sizing are set by ThemeProvider */
/* --vw: 3vw;
--text-2xs: 2.5vw;
--text-xs: 2.75vw;
--text-sm: 3vw;
--text-base: 3.25vw;
--text-lg: 3.5vw;
--text-xl: 4.25vw;
--text-2xl: 5vw;
--text-3xl: 6vw;
--text-4xl: 7vw;
--text-5xl: 7.5vw;
--text-6xl: 8.5vw;
--text-7xl: 10vw;
--text-8xl: 12vw;
--text-9xl: 14vw; */
--width-5: 5vw;
--width-7_5: 7.5vw;
--width-10: 10vw;
--width-12_5: 12.5vw;
--width-15: 15vw;
--width-17_5: 17.5vw;
--width-20: 20vw;
--width-22_5: 22.5vw;
--width-25: 25vw;
--width-27_5: 27.5vw;
--width-30: 30vw;
--width-32_5: 32.5vw;
--width-35: 35vw;
--width-37_5: 37.5vw;
--width-40: 40vw;
--width-42_5: 42.5vw;
--width-45: 45vw;
--width-47_5: 47.5vw;
--width-50: 50vw;
--width-52_5: 52.5vw;
--width-55: 55vw;
--width-57_5: 57.5vw;
--width-60: 60vw;
--width-62_5: 62.5vw;
--width-65: 65vw;
--width-67_5: 67.5vw;
--width-70: 70vw;
--width-72_5: 72.5vw;
--width-75: 75vw;
--width-77_5: 77.5vw;
--width-80: 80vw;
--width-82_5: 82.5vw;
--width-85: 85vw;
--width-87_5: 87.5vw;
--width-90: 90vw;
--width-92_5: 92.5vw;
--width-95: 95vw;
--width-97_5: 97.5vw;
--width-100: 100vw;
/* --width-content-width and --width-content-width-expanded are set by ThemeProvider */
--width-carousel-padding: calc((100vw - var(--width-content-width)) / 2 + 1px - var(--vw-1_5));
--width-carousel-padding-controls: calc((100vw - var(--width-content-width)) / 2 + 1px);
--width-carousel-padding-expanded: calc((var(--width-content-width-expanded) - var(--width-content-width)) / 2 + 1px - var(--vw-1_5));
--width-carousel-padding-controls-expanded: calc((var(--width-content-width-expanded) - var(--width-content-width)) / 2 + 1px);
--width-carousel-item-3: var(--width-content-width);
--width-carousel-item-4: var(--width-content-width);
--width-x-padding-mask-fade: 10vw;
--height-4: 3.5vw;
--height-5: 4.5vw;
--height-6: 5.5vw;
--height-7: 6.5vw;
--height-8: 7.5vw;
--height-9: 8.5vw;
--height-10: 9vw;
--height-11: 10vw;
--height-12: 11vw;
--height-30: 25vw;
--height-90: 81vw;
--height-100: 90vw;
--height-110: 99vw;
--height-120: 108vw;
--height-130: 117vw;
--height-140: 126vw;
--height-150: 135vw;
}
}
@theme inline {
--color-background: var(--background);
--color-card: var(--card);
--color-foreground: var(--foreground);
--color-primary-cta: var(--primary-cta);
--color-secondary-cta: var(--secondary-cta);
--color-accent: var(--accent);
--color-background-accent: var(--background-accent);
/* theme border radius */
--radius-theme: var(--theme-border-radius);
--radius-theme-capped: var(--theme-border-radius-capped);
/* text */
--text-2xs: var(--text-2xs);
--text-xs: var(--text-xs);
--text-sm: var(--text-sm);
--text-base: var(--text-base);
--text-lg: var(--text-lg);
--text-xl: var(--text-xl);
--text-2xl: var(--text-2xl);
--text-3xl: var(--text-3xl);
--text-4xl: var(--text-4xl);
--text-5xl: var(--text-5xl);
--text-6xl: var(--text-6xl);
--text-7xl: var(--text-7xl);
--text-8xl: var(--text-8xl);
--text-9xl: var(--text-9xl);
/* height */
--height-4: var(--height-4);
--height-5: var(--height-5);
--height-6: var(--height-6);
--height-7: var(--height-7);
--height-8: var(--height-8);
--height-9: var(--height-9);
--height-11: var(--height-11);
--height-12: var(--height-12);
--height-10: var(--height-10);
--height-30: var(--height-30);
--height-90: var(--height-90);
--height-100: var(--height-100);
--height-110: var(--height-110);
--height-120: var(--height-120);
--height-130: var(--height-130);
--height-140: var(--height-140);
--height-150: var(--height-150);
--height-page-padding: calc(2.25rem+var(--vw-1_5)+var(--vw-1_5));
/* width */
--width-5: var(--width-5);
--width-7_5: var(--width-7_5);
--width-10: var(--width-10);
--width-12_5: var(--width-12_5);
--width-15: var(--width-15);
--width-17: var(--width-17);
--width-17_5: var(--width-17_5);
--width-20: var(--width-20);
--width-21: var(--width-21);
--width-22_5: var(--width-22_5);
--width-25: var(--width-25);
--width-26: var(--width-26);
--width-27_5: var(--width-27_5);
--width-30: var(--width-30);
--width-32_5: var(--width-32_5);
--width-35: var(--width-35);
--width-37_5: var(--width-37_5);
--width-40: var(--width-40);
--width-42_5: var(--width-42_5);
--width-45: var(--width-45);
--width-47_5: var(--width-47_5);
--width-50: var(--width-50);
--width-52_5: var(--width-52_5);
--width-55: var(--width-55);
--width-57_5: var(--width-57_5);
--width-60: var(--width-60);
--width-62_5: var(--width-62_5);
--width-65: var(--width-65);
--width-67_5: var(--width-67_5);
--width-70: var(--width-70);
--width-72_5: var(--width-72_5);
--width-75: var(--width-75);
--width-77_5: var(--width-77_5);
--width-80: var(--width-80);
--width-82_5: var(--width-82_5);
--width-85: var(--width-85);
--width-87_5: var(--width-87_5);
--width-90: var(--width-90);
--width-92_5: var(--width-92_5);
--width-95: var(--width-95);
--width-97_5: var(--width-97_5);
--width-100: var(--width-100);
--width-content-width: var(--width-content-width);
--width-carousel-padding: var(--width-carousel-padding);
--width-carousel-padding-controls: var(--width-carousel-padding-controls);
--width-carousel-padding-expanded: var(--width-carousel-padding-expanded);
--width-carousel-padding-controls-expanded: var(--width-carousel-padding-controls-expanded);
--width-carousel-item-3: var(--width-carousel-item-3);
--width-carousel-item-4: var(--width-carousel-item-4);
--width-x-padding-mask-fade: var(--width-x-padding-mask-fade);
--width-content-width-expanded: var(--width-content-width-expanded);
/* gap */
--spacing-1: var(--vw-0_25);
--spacing-2: var(--vw-0_5);
--spacing-3: var(--vw-0_75);
--spacing-4: var(--vw-1);
--spacing-5: var(--vw-1_25);
--spacing-6: var(--vw-1_5);
--spacing-7: var(--vw-1_75);
--spacing-8: var(--vw-2);
--spacing-x-1: var(--vw-0_25);
--spacing-x-2: var(--vw-0_5);
--spacing-x-3: var(--vw-0_75);
--spacing-x-4: var(--vw-1);
--spacing-x-5: var(--vw-1_25);
--spacing-x-6: var(--vw-1_5);
/* border radius */
--radius-none: 0;
--radius-sm: var(--vw-0_5);
--radius: var(--vw-0_75);
--radius-md: var(--vw-1);
--radius-lg: var(--vw-1_25);
--radius-xl: var(--vw-1_75);
--radius-full: 999px;
/* padding */
--padding-1: var(--vw-0_25);
--padding-2: var(--vw-0_5);
--padding-2.5: var(--vw-0_625);
--padding-3: var(--vw-0_75);
--padding-4: var(--vw-1);
--padding-5: var(--vw-1_25);
--padding-6: var(--vw-1_5);
--padding-7: var(--vw-1_75);
--padding-8: var(--vw-2);
--padding-x-1: var(--vw-0_25);
--padding-x-2: var(--vw-0_5);
--padding-x-3: var(--vw-0_75);
--padding-x-4: var(--vw-1);
--padding-x-5: var(--vw-1_25);
--padding-x-6: var(--vw-1_5);
--padding-x-7: var(--vw-1_75);
--padding-x-8: var(--vw-2);
--padding-hero-page-padding-half: var(--padding-hero-page-padding-half);
--padding-hero-page-padding: var(--padding-hero-page-padding);
--padding-hero-page-padding-1_5: var(--padding-hero-page-padding-1_5);
--padding-hero-page-padding-double: var(--padding-hero-page-padding-double);
/* margin */
--margin-1: var(--vw-0_25);
--margin-2: var(--vw-0_5);
--margin-3: var(--vw-0_75);
--margin-4: var(--vw-1);
--margin-5: var(--vw-1_25);
--margin-6: var(--vw-1_5);
--margin-7: var(--vw-1_75);
--margin-8: var(--vw-2);
--margin-x-1: var(--vw-0_25);
--margin-x-2: var(--vw-0_5);
--margin-x-3: var(--vw-0_75);
--margin-x-4: var(--vw-1);
--margin-x-5: var(--vw-1_25);
--margin-x-6: var(--vw-1_5);
--margin-x-7: var(--vw-1_75);
--margin-x-8: var(--vw-2);
}
@layer components {}
@layer utilities {
/* Card, primary-button, and secondary-button styles are now dynamically injected via ThemeProvider */
/* .card {
@apply backdrop-blur-sm bg-gradient-to-br from-card/80 to-card/40 shadow-sm border border-card;
}
.primary-button {
@apply bg-gradient-to-b from-primary-cta/83 to-primary-cta;
box-shadow:
color-mix(in srgb, var(--color-background) 25%, transparent) 0px 1px 1px 0px inset,
color-mix(in srgb, var(--color-primary-cta) 15%, transparent) 3px 3px 3px 0px;
}
.secondary-button {
@apply backdrop-blur-sm bg-gradient-to-br from-secondary-cta/80 to-secondary-cta shadow-sm border border-secondary-cta;
} */
.tag-card {
@apply backdrop-blur-sm bg-gradient-to-br from-card/80 to-card/40 shadow-sm border border-card;
}
.mask-fade-x {
-webkit-mask-image: linear-gradient(to right, transparent 0%, transparent calc((100vw - var(--width-content-width)) / 4), black calc((100vw - var(--width-content-width)) / 2 + 5vw), black calc(100% - (100vw - var(--width-content-width)) / 2 - 5vw), transparent calc(100% - (100vw - var(--width-content-width)) / 4), transparent 100%);
mask-image: linear-gradient(to right, transparent 0%, transparent calc((100vw - var(--width-content-width)) / 4), black calc((100vw - var(--width-content-width)) / 2 + 5vw), black calc(100% - (100vw - var(--width-content-width)) / 2 - 5vw), transparent calc(100% - (100vw - var(--width-content-width)) / 4), transparent 100%);
}
.mask-padding-x {
-webkit-mask-image: linear-gradient(to right, transparent 0%, black var(--width-x-padding-mask-fade), black calc(100% - var(--width-x-padding-mask-fade)), transparent 100%);
mask-image: linear-gradient(to right, transparent 0%, black var(--width-x-padding-mask-fade), black calc(100% - var(--width-x-padding-mask-fade)), transparent 100%);
}
.mask-fade-bottom {
-webkit-mask-image: linear-gradient(to bottom, black 0%, black 50%, transparent 100%);
mask-image: linear-gradient(to bottom, black 0%, black 50%, transparent 100%);
}
.mask-fade-y {
mask-image: linear-gradient(to bottom,
transparent 0%,
black var(--vw-1_5),
black calc(100% - var(--vw-1_5)),
transparent 100%);
}
.mask-fade-bottom-large {
-webkit-mask-image: linear-gradient(to bottom, black 0%, black 50%, transparent 75%, transparent 100%);
mask-image: linear-gradient(to bottom, black 0%, black 50%, transparent 75%, transparent 100%);
}
.mask-fade-bottom-long {
-webkit-mask-image: linear-gradient(to bottom, black 0%, black 5%, transparent 100%);
mask-image: linear-gradient(to bottom, black 0%, black 5%, transparent 100%);
}
.mask-fade-top-long {
-webkit-mask-image: linear-gradient(to top, black 0%, black 5%, transparent 100%);
mask-image: linear-gradient(to top, black 0%, black 5%, transparent 100%);
}
.mask-fade-xy {
-webkit-mask-image:
linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%),
linear-gradient(to bottom, transparent 0%, black 20%, black 80%, transparent 100%);
mask-image:
linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%),
linear-gradient(to bottom, transparent 0%, black 20%, black 80%, transparent 100%);
-webkit-mask-composite: source-in;
mask-composite: intersect;
}
/* ANIMATION */
.animation-container {
animation:
fadeInOpacity 0.8s ease-in-out forwards,
fadeInTranslate 0.6s forwards;
}
.animation-container-fade {
animation: fadeInOpacity 0.8s ease-in-out forwards;
}
@keyframes fadeInOpacity {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeInTranslate {
from {
transform: translateY(0.75vh);
}
to {
transform: translateY(0vh);
}
}
@keyframes aurora {
from {
background-position: 50% 50%, 50% 50%;
}
to {
background-position: 350% 50%, 350% 50%;
}
}
@keyframes spin-slow {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes spin-reverse {
from {
transform: rotate(0deg);
}
to {
transform: rotate(-360deg);
}
}
.animate-spin-slow {
animation: spin-slow 15s linear infinite;
}
.animate-spin-reverse {
animation: spin-reverse 10s linear infinite;
}
@keyframes marquee-vertical {
from {
transform: translateY(0);
}
to {
transform: translateY(-50%);
}
}
.animate-marquee-vertical {
animation: marquee-vertical 20s linear infinite;
}
@keyframes orbit {
from {
transform: rotate(var(--initial-position, 0deg)) translateX(var(--translate-position, 120px)) rotate(calc(-1 * var(--initial-position, 0deg)));
}
to {
transform: rotate(calc(var(--initial-position, 0deg) + 360deg)) translateX(var(--translate-position, 120px)) rotate(calc(-1 * (var(--initial-position, 0deg) + 360deg)));
}
}
@keyframes map-dot-pulse {
0%, 100% {
transform: scale(0.4);
opacity: 0.6;
}
50% {
transform: scale(1.4);
opacity: 1;
}
}
}
* {
scrollbar-width: thin;
scrollbar-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 0);
}
html {
overscroll-behavior: none;
overscroll-behavior-y: none;
}
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-poppins), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;
overscroll-behavior-y: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--font-poppins), sans-serif;
}

1281
src/app/layout.tsx Normal file

File diff suppressed because it is too large Load Diff

167
src/app/news/page.tsx Normal file
View File

@@ -0,0 +1,167 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import CustomNavbar from "@/components/navbar/CustomNavbar";
import LatestNews from "@/components/blog/LatestNews";
import FooterSection from "@/components/footer/FooterSection";
export default function NewsPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<CustomNavbar
logo="BvB Young"
links={[
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" },
{ label: "Contact", href: "/contact" }
]}
/>
</div>
<div id="news-main" data-section="news-main" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<LatestNews
title="BvB Young News & Updates"
description="Stay up-to-date with the latest news, achievements, and developments from our academy. From tournament victories to facility upgrades, discover what's happening at BvB Young."
articles={[
{
id: "1",
title: "Championship Victory!",
excerpt: "BvB Young claims regional championship with dominant 3-0 performance in final match against top competitors",
date: "2024-01-15",
imageSrc: "https://img.b2bpic.net/free-photo/woman-holding-soccer-ball-running-through-cones_23-2148355364.jpg",
author: "Team News"
},
{
id: "2",
title: "International Tournament Success",
excerpt: "Our players shine in European youth tournament, securing second place finish and valuable international experience",
date: "2024-01-10",
imageSrc: "https://img.b2bpic.net/free-photo/football-trainer-helping-kids-medium-shot_23-2149742061.jpg",
author: "Sports Updates"
},
{
id: "3",
title: "New Training Facilities Unveiled",
excerpt: "State-of-the-art performance center opens for enhanced player development and training capabilities",
date: "2024-01-05",
imageSrc: "https://img.b2bpic.net/free-photo/women-warming-up-football-field_23-2148355388.jpg",
author: "Club Announcements"
},
{
id: "4",
title: "Elite Coaching Certification Program",
excerpt: "BvB Young coaching staff completes advanced UEFA certification, bringing latest methodologies to our academy",
date: "2023-12-28",
imageSrc: "https://img.b2bpic.net/free-photo/football-trainer-helping-kids-back-view_23-2149742058.jpg",
author: "Academy Updates"
},
{
id: "5",
title: "Youth League Quarter-Final Qualification",
excerpt: "Outstanding team performance secures advancement to quarter-finals in prestigious regional youth league",
date: "2023-12-20",
imageSrc: "https://img.b2bpic.net/free-photo/smiling-blonde-girl-running-through-cones_23-2148355370.jpg",
author: "Match Reports"
},
{
id: "6",
title: "Partnership with Professional Club",
excerpt: "New strategic partnership opens pathways for academy graduates to professional football opportunities",
date: "2023-12-12",
imageSrc: "https://img.b2bpic.net/free-photo/woman-stretching-leg-field-full-shot_23-2148930217.jpg",
author: "Partnership News"
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="upcoming" data-section="upcoming" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<div className="max-w-4xl mx-auto text-center">
<h2 className="text-3xl md:text-4xl lg:text-5xl font-medium mb-6">Upcoming Events</h2>
<p className="text-lg md:text-xl text-foreground/80 mb-12">
Mark your calendars for these exciting upcoming events and matches.
</p>
<div className="space-y-6">
<div className="p-6 rounded-lg bg-card/50 text-left">
<div className="flex justify-between items-start mb-2">
<h3 className="text-xl font-semibold">Regional Championship Semi-Final</h3>
<span className="text-sm text-foreground/70">February 15, 2024</span>
</div>
<p className="text-foreground/70">BvB Young vs. FC Berlin Youth - Home match at our training center stadium.</p>
</div>
<div className="p-6 rounded-lg bg-card/50 text-left">
<div className="flex justify-between items-start mb-2">
<h3 className="text-xl font-semibold">International Training Camp</h3>
<span className="text-sm text-foreground/70">March 2-9, 2024</span>
</div>
<p className="text-foreground/70">Week-long intensive training program in Barcelona with international coaching staff.</p>
</div>
</div>
</div>
</div>
<div id="media" data-section="media" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<div className="max-w-4xl mx-auto text-center">
<h2 className="text-3xl md:text-4xl lg:text-5xl font-medium mb-6">Media Center</h2>
<p className="text-lg md:text-xl text-foreground/80 mb-12">
Access our photo galleries, video highlights, and press resources.
</p>
<div className="grid md:grid-cols-2 gap-8">
<div className="p-6 rounded-lg bg-card/50 text-left">
<h3 className="text-xl font-semibold mb-4">Photo Gallery</h3>
<p className="text-foreground/70">Browse through our collection of training sessions, matches, and academy life moments.</p>
</div>
<div className="p-6 rounded-lg bg-card/50 text-left">
<h3 className="text-xl font-semibold mb-4">Video Highlights</h3>
<p className="text-foreground/70">Watch match highlights, player interviews, and behind-the-scenes content from our academy.</p>
</div>
</div>
</div>
</div>
<FooterSection
companyName="BvB Young"
description="Developing the next generation of football champions"
sections={[
{
title: "Quick Links",
links: [
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" }
]
},
{
title: "Contact",
links: [
{ label: "Email: info@bvbyoung.com", href: "mailto:info@bvbyoung.com" },
{ label: "Phone: +49 231 1234567", href: "tel:+4923112345567" }
]
}
]}
socialLinks={[
{ platform: "facebook", url: "https://facebook.com/bvbyoung" },
{ platform: "instagram", url: "https://instagram.com/bvbyoung" },
{ platform: "twitter", url: "https://twitter.com/bvbyoung" }
]}
copyright="© 2024 BvB Young. All rights reserved."
/>
</ThemeProvider>
);
}

262
src/app/page.tsx Normal file
View File

@@ -0,0 +1,262 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import CustomNavbar from "@/components/navbar/CustomNavbar";
import HeroSection from "@/components/hero/HeroSection";
import AboutTeam from "@/components/about/AboutTeam";
import SquadShowcase from "@/components/product/SquadShowcase";
import LatestNews from "@/components/blog/LatestNews";
import AchievementsMetrics from "@/components/metric/AchievementsMetrics";
import PlayerTestimonials from "@/components/testimonial/PlayerTestimonials";
import FooterSection from "@/components/footer/FooterSection";
import { Users, Trophy, Globe, Award } from "lucide-react";
export default function HomePage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<CustomNavbar
logo="BvB Young"
links={[
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" },
{ label: "Contact", href: "/contact" }
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroSection
title="BvB Young"
subtitle="Experience Excellence in Youth Football"
description="Developing the next generation of football champions. Join us on our journey to greatness."
primaryCta="Explore Our Squad"
secondaryCta="Learn More"
backgroundImage="https://img.b2bpic.net/free-photo/football-trainer-helping-kids-back-view_23-2149742058.jpg"
heroAlign="center"
useInvertedBackground="noInvert"
/>
</div>
<div id="about" data-section="about">
<AboutTeam
title="About BvB Young"
description="BvB Young is a premier youth football academy dedicated to nurturing talent and building champions. With a focus on technical excellence, tactical intelligence, and character development, we prepare young players for success both on and off the pitch."
features={[
{
title: "Elite Coaching",
description: "World-class coaching staff with extensive professional experience"
},
{
title: "Modern Facilities",
description: "State-of-the-art training grounds and performance centers"
},
{
title: "Player Development",
description: "Comprehensive development programs from grassroots to professional level"
},
{
title: "Competition Ready",
description: "Regular domestic and international competitive opportunities"
}
]}
useInvertedBackground="invertDefault"
/>
</div>
<div id="squad" data-section="squad">
<SquadShowcase
title="Meet Our Squad"
description="Introducing the talented young players representing BvB Young"
players={[
{
id: "1",
name: "Marcus Weber",
position: "Forward",
number: "9",
imageSrc: "https://img.b2bpic.net/free-photo/smiling-blonde-girl-running-through-cones_23-2148355370.jpg",
rating: 5
},
{
id: "2",
name: "Julian Koch",
position: "Midfielder",
number: "8",
imageSrc: "https://img.b2bpic.net/free-photo/woman-stretching-leg-field-full-shot_23-2148930217.jpg",
rating: 5
},
{
id: "3",
name: "Leon Bauer",
position: "Defender",
number: "5",
imageSrc: "https://img.b2bpic.net/free-photo/football-trainer-teaching-his-pupils_23-2149708043.jpg",
rating: 4
},
{
id: "4",
name: "Alex Hoffmann",
position: "Goalkeeper",
number: "1",
imageSrc: "https://img.b2bpic.net/free-photo/man-training-kids-playing-football-full-shot_23-2149742079.jpg",
rating: 5
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="news" data-section="news">
<LatestNews
title="Latest News & Updates"
description="Stay informed about BvB Young's recent achievements and upcoming events"
articles={[
{
id: "1",
title: "Championship Victory!",
excerpt: "BvB Young claims regional championship with dominant 3-0 performance in final match",
date: "2024-01-15",
imageSrc: "https://img.b2bpic.net/free-photo/woman-holding-soccer-ball-running-through-cones_23-2148355364.jpg",
author: "Team News"
},
{
id: "2",
title: "International Tournament Success",
excerpt: "Our players shine in European youth tournament, securing second place finish",
date: "2024-01-10",
imageSrc: "https://img.b2bpic.net/free-photo/football-trainer-helping-kids-medium-shot_23-2149742061.jpg",
author: "Sports Updates"
},
{
id: "3",
title: "New Training Facilities Unveiled",
excerpt: "State-of-the-art performance center opens for enhanced player development",
date: "2024-01-05",
imageSrc: "https://img.b2bpic.net/free-photo/women-warming-up-football-field_23-2148355388.jpg",
author: "Club Announcements"
}
]}
useInvertedBackground="invertDefault"
/>
</div>
<div id="metrics" data-section="metrics">
<AchievementsMetrics
title="Our Achievements"
description="Proven track record of excellence and development"
metrics={[
{
label: "Players Developed",
value: "150+",
icon: Users
},
{
label: "Tournament Wins",
value: "28",
icon: Trophy
},
{
label: "International Caps",
value: "45",
icon: Globe
},
{
label: "Years of Excellence",
value: "15",
icon: Award
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="testimonials" data-section="testimonials">
<PlayerTestimonials
title="What Players Say"
description="Hear from our academy members about their experience at BvB Young"
testimonials={[
{
id: "1",
name: "Thomas Schmidt",
role: "Forward",
company: "BvB Young Academy",
rating: 5,
quote: "BvB Young changed my life. The coaching is exceptional and the training facilities are world-class. I've improved dramatically here.",
imageSrc: "https://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg"
},
{
id: "2",
name: "Sophie Wagner",
role: "Midfielder",
company: "BvB Young Academy",
rating: 5,
quote: "The professional environment at BvB Young prepares you for everything. The coaches believe in you and push you to be better every day.",
imageSrc: "https://img.b2bpic.net/free-photo/handsome-young-runner-looking-camera_23-2148162136.jpg"
},
{
id: "3",
name: "Daniel Krause",
role: "Defender",
company: "BvB Young Academy",
rating: 5,
quote: "Playing for BvB Young has been a dream come true. The competitive level and support system are unmatched.",
imageSrc: "https://img.b2bpic.net/free-photo/handsome-darkskinned-browneyed-brunette-longsleeved-tshirt-looks-into-camera-runs-upstairs-outdoors_197531-28721.jpg"
},
{
id: "4",
name: "Jessica Mueller",
role: "Goalkeeper",
company: "BvB Young Academy",
rating: 5,
quote: "Best decision ever. The academy focuses on holistic development - skill, tactics, and character. Highly recommend!",
imageSrc: "https://img.b2bpic.net/free-photo/portrait-muscular-young-man-race-track_23-2148162181.jpg"
}
]}
useInvertedBackground="invertDefault"
/>
</div>
<FooterSection
companyName="BvB Young"
description="Developing the next generation of football champions"
sections={[
{
title: "Quick Links",
links: [
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" }
]
},
{
title: "Contact",
links: [
{ label: "Email: info@bvbyoung.com", href: "mailto:info@bvbyoung.com" },
{ label: "Phone: +49 231 1234567", href: "tel:+4923112345567" }
]
}
]}
socialLinks={[
{ platform: "facebook", url: "https://facebook.com/bvbyoung" },
{ platform: "instagram", url: "https://instagram.com/bvbyoung" },
{ platform: "twitter", url: "https://twitter.com/bvbyoung" }
]}
copyright="© 2024 BvB Young. All rights reserved."
/>
</ThemeProvider>
);
}

189
src/app/players/page.tsx Normal file
View File

@@ -0,0 +1,189 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import CustomNavbar from "@/components/navbar/CustomNavbar";
import SquadShowcase from "@/components/product/SquadShowcase";
import PlayerTestimonials from "@/components/testimonial/PlayerTestimonials";
import FooterSection from "@/components/footer/FooterSection";
export default function PlayersPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<CustomNavbar
logo="BvB Young"
links={[
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" },
{ label: "Contact", href: "/contact" }
]}
/>
</div>
<div id="squad" data-section="squad" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<SquadShowcase
title="Our Talented Squad"
description="Meet the exceptional young athletes who represent the future of football. Each player brings unique skills, dedication, and passion to our academy."
players={[
{
id: "1",
name: "Marcus Weber",
position: "Forward",
number: "9",
imageSrc: "https://img.b2bpic.net/free-photo/smiling-blonde-girl-running-through-cones_23-2148355370.jpg",
rating: 5
},
{
id: "2",
name: "Julian Koch",
position: "Midfielder",
number: "8",
imageSrc: "https://img.b2bpic.net/free-photo/woman-stretching-leg-field-full-shot_23-2148930217.jpg",
rating: 5
},
{
id: "3",
name: "Leon Bauer",
position: "Defender",
number: "5",
imageSrc: "https://img.b2bpic.net/free-photo/football-trainer-teaching-his-pupils_23-2149708043.jpg",
rating: 4
},
{
id: "4",
name: "Alex Hoffmann",
position: "Goalkeeper",
number: "1",
imageSrc: "https://img.b2bpic.net/free-photo/man-training-kids-playing-football-full-shot_23-2149742079.jpg",
rating: 5
},
{
id: "5",
name: "Finn Müller",
position: "Midfielder",
number: "10",
imageSrc: "https://img.b2bpic.net/free-photo/smiling-blonde-girl-running-through-cones_23-2148355370.jpg",
rating: 5
},
{
id: "6",
name: "Lukas Schmidt",
position: "Forward",
number: "11",
imageSrc: "https://img.b2bpic.net/free-photo/woman-stretching-leg-field-full-shot_23-2148930217.jpg",
rating: 4
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="testimonials" data-section="testimonials" className="mx-auto px-4 md:px-6">
<PlayerTestimonials
title="Player Experiences"
description="Hear directly from our academy members about their journey with BvB Young"
testimonials={[
{
id: "1",
name: "Thomas Schmidt",
role: "Forward",
company: "BvB Young Academy",
rating: 5,
quote: "BvB Young changed my life. The coaching is exceptional and the training facilities are world-class. I've improved dramatically here.",
imageSrc: "https://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg"
},
{
id: "2",
name: "Sophie Wagner",
role: "Midfielder",
company: "BvB Young Academy",
rating: 5,
quote: "The professional environment at BvB Young prepares you for everything. The coaches believe in you and push you to be better every day.",
imageSrc: "https://img.b2bpic.net/free-photo/handsome-young-runner-looking-camera_23-2148162136.jpg"
},
{
id: "3",
name: "Daniel Krause",
role: "Defender",
company: "BvB Young Academy",
rating: 5,
quote: "Playing for BvB Young has been a dream come true. The competitive level and support system are unmatched.",
imageSrc: "https://img.b2bpic.net/free-photo/handsome-darkskinned-browneyed-brunette-longsleeved-tshirt-looks-into-camera-runs-upstairs-outdoors_197531-28721.jpg"
},
{
id: "4",
name: "Jessica Mueller",
role: "Goalkeeper",
company: "BvB Young Academy",
rating: 5,
quote: "Best decision ever. The academy focuses on holistic development - skill, tactics, and character. Highly recommend!",
imageSrc: "https://img.b2bpic.net/free-photo/portrait-muscular-young-man-race-track_23-2148162181.jpg"
}
]}
useInvertedBackground="invertDefault"
/>
</div>
<div id="development" data-section="development" className="mx-auto px-4 md:px-6 py-16 md:py-24">
<div className="max-w-4xl mx-auto text-center">
<h2 className="text-3xl md:text-4xl lg:text-5xl font-medium mb-6">Player Development Program</h2>
<p className="text-lg md:text-xl text-foreground/80 mb-12">
Our comprehensive development approach ensures every player reaches their maximum potential through structured training phases.
</p>
<div className="grid md:grid-cols-2 gap-8">
<div className="p-6 rounded-lg bg-card/50 text-left">
<h3 className="text-xl font-semibold mb-4">Technical Skills</h3>
<p className="text-foreground/70">Individual ball control, passing accuracy, shooting technique, and position-specific skills development.</p>
</div>
<div className="p-6 rounded-lg bg-card/50 text-left">
<h3 className="text-xl font-semibold mb-4">Tactical Understanding</h3>
<p className="text-foreground/70">Game intelligence, positioning, decision-making, and understanding of modern football systems.</p>
</div>
</div>
</div>
</div>
<FooterSection
companyName="BvB Young"
description="Developing the next generation of football champions"
sections={[
{
title: "Quick Links",
links: [
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" }
]
},
{
title: "Contact",
links: [
{ label: "Email: info@bvbyoung.com", href: "mailto:info@bvbyoung.com" },
{ label: "Phone: +49 231 1234567", href: "tel:+4923112345567" }
]
}
]}
socialLinks={[
{ platform: "facebook", url: "https://facebook.com/bvbyoung" },
{ platform: "instagram", url: "https://instagram.com/bvbyoung" },
{ platform: "twitter", url: "https://twitter.com/bvbyoung" }
]}
copyright="© 2024 BvB Young. All rights reserved."
/>
</ThemeProvider>
);
}

117
src/app/shop/page.tsx Normal file
View File

@@ -0,0 +1,117 @@
"use client"
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import CustomNavbar from "@/components/navbar/CustomNavbar";
import FooterSection from "@/components/footer/FooterSection";
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import { Star } from 'lucide-react';
const products = [
{
id: "1", brand: "Nike", name: "BvB Home Jersey 2024", price: "$89.99", rating: 5,
reviewCount: "2.1k", imageSrc: "/products/bvb-jersey-home.jpg", imageAlt: "BvB Home Jersey 2024", isFavorited: false
},
{
id: "2", brand: "Puma", name: "BvB Training Shorts", price: "$34.99", rating: 4,
reviewCount: "856", imageSrc: "/products/bvb-shorts.jpg", imageAlt: "BvB Training Shorts", isFavorited: false
},
{
id: "3", brand: "Adidas", name: "Football Boots Pro", price: "$159.99", rating: 5,
reviewCount: "1.3k", imageSrc: "/products/football-boots.jpg", imageAlt: "Football Boots Pro", isFavorited: true
},
{
id: "4", brand: "Nike", name: "BvB Away Jersey 2024", price: "$89.99", rating: 4,
reviewCount: "1.8k", imageSrc: "/products/bvb-jersey-away.jpg", imageAlt: "BvB Away Jersey 2024", isFavorited: false
},
{
id: "5", brand: "Puma", name: "Training Jacket", price: "$69.99", rating: 4,
reviewCount: "642", imageSrc: "/products/training-jacket.jpg", imageAlt: "Training Jacket", isFavorited: false
},
{
id: "6", brand: "Under Armour", name: "Performance Socks", price: "$19.99", rating: 5,
reviewCount: "923", imageSrc: "/products/performance-socks.jpg", imageAlt: "Performance Socks", isFavorited: false
}
];
export default function ShopPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<div className="min-h-screen flex flex-col">
<CustomNavbar
logo="BvB Young"
links={[
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" },
{ label: "Contact", href: "/contact" }
]}
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" }
]}
/>
<main className="flex-1">
<ProductCardTwo
products={products}
title="Official BvB Store"
description="Discover our premium collection of official merchandise, training gear, and fan favorites"
tag="New Arrivals"
tagIcon={Star}
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
useInvertedBackground="noInvert"
buttons={[
{
text: "View All Products", href: "/shop/all"
},
{
text: "Sale Items", href: "/shop/sale"
}
]}
/>
</main>
<FooterSection
companyName="BvB Young"
description="Developing the next generation of football champions"
sections={[
{
title: "Quick Links", links: [
{ label: "Home", href: "/" },
{ label: "About", href: "/about" },
{ label: "Players", href: "/players" },
{ label: "News", href: "/news" }
]
},
{
title: "Contact", links: [
{ label: "Email: info@bvbyoung.com", href: "mailto:info@bvbyoung.com" },
{ label: "Phone: +49 231 1234567", href: "tel:+4923112345567" }
]
}
]}
socialLinks={[
{ platform: "facebook", url: "https://facebook.com/bvbyoung" },
{ platform: "instagram", url: "https://instagram.com/bvbyoung" },
{ platform: "twitter", url: "https://twitter.com/bvbyoung" }
]}
copyright="© 2024 BvB Young. All rights reserved."
/>
</div>
</ThemeProvider>
);
}