160 lines
6.8 KiB
TypeScript
160 lines
6.8 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import SplitAbout from '@/components/sections/about/SplitAbout';
|
|
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import { BookOpen, Video, Calendar, Gamepad2, TrendingUp, Clock, Lightbulb, Trophy } from 'lucide-react';
|
|
|
|
export default function TutorialsPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumLarge"
|
|
sizing="mediumLargeSizeMediumTitles"
|
|
background="fluid"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="medium"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: 'Home', id: '/' },
|
|
{ name: 'Courses', id: '/courses' },
|
|
{ name: 'Daily Lessons', id: '/daily-lessons' },
|
|
{ name: 'Tutorials', id: '/tutorials' },
|
|
{ name: 'Curriculum', id: '/curriculum' },
|
|
{ name: 'Simulator', id: '#simulator' },
|
|
{ name: 'Resources', id: '#tactical-learning' },
|
|
{ name: 'Contact', id: '#contact' }
|
|
]}
|
|
brandName="Future Coach"
|
|
bottomLeftText="Football Coaching Academy"
|
|
bottomRightText="support@futurecoach.com"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
logoText="Video Tutorials"
|
|
description="Learn professional coaching tactics through embedded video tutorials. Watch expert coaches explain key concepts, demonstrate tactical setups, and break down real match situations."
|
|
buttons={[
|
|
{ text: 'Watch Tutorials', href: '#videos' },
|
|
{ text: 'Back to Home', href: '/' }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
background={{ variant: 'sparkles-gradient' }}
|
|
videoSrc="https://www.youtube.com/embed/dQw4w9WgXcQ"
|
|
videoAriaLabel="Football coaching tutorial introduction"
|
|
mediaAnimation="slide-up"
|
|
frameStyle="card"
|
|
className="w-full"
|
|
containerClassName="py-16 md:py-24"
|
|
logoClassName="text-5xl md:text-7xl font-bold"
|
|
descriptionClassName="text-lg md:text-xl"
|
|
buttonContainerClassName="flex gap-4 mt-8"
|
|
/>
|
|
</div>
|
|
|
|
<div id="videos" data-section="videos">
|
|
<FeatureCardEight
|
|
title="Interactive Video Learning"
|
|
description="Professional video tutorials with embedded players for seamless learning experience"
|
|
tag="Video Content"
|
|
tagAnimation="slide-up"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: 'Tactical Formation Breakdown',
|
|
description: 'Expert coaches demonstrate the 4-3-3 formation step-by-step with video breakdown of player positioning, movement patterns, and tactical responsibilities.',
|
|
videoSrc: 'https://www.youtube.com/embed/dQw4w9WgXcQ',
|
|
videoAriaLabel: 'Tactical formation video tutorial'
|
|
},
|
|
{
|
|
id: 2,
|
|
title: 'Pressing System Tutorial',
|
|
description: 'Learn advanced pressing systems through video analysis showing real match footage, trigger points, and defensive coordination between players.',
|
|
videoSrc: 'https://www.youtube.com/embed/dQw4w9WgXcQ',
|
|
videoAriaLabel: 'Pressing system video tutorial'
|
|
},
|
|
{
|
|
id: 3,
|
|
title: 'Set Piece Routines Guide',
|
|
description: 'Video walkthrough of designing corner kicks, free kicks, and throw-in plays with animation and real-world match examples.',
|
|
videoSrc: 'https://www.youtube.com/embed/dQw4w9WgXcQ',
|
|
videoAriaLabel: 'Set pieces design video guide'
|
|
},
|
|
{
|
|
id: 4,
|
|
title: 'Match Analysis Workshop',
|
|
description: 'Comprehensive video guide on analyzing opponent tactics, identifying weaknesses, and preparing your team for upcoming matches.',
|
|
videoSrc: 'https://www.youtube.com/embed/dQw4w9WgXcQ',
|
|
videoAriaLabel: 'Match analysis workshop video'
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
tag="Learn More"
|
|
title="Access Our Complete Video Tutorial Library"
|
|
description="Get instant access to professional video tutorials covering all aspects of football coaching. Learn at your own pace with expert instruction and real match analysis."
|
|
tagAnimation="slide-up"
|
|
background={{ variant: 'sparkles-gradient' }}
|
|
useInvertedBackground={false}
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Start Watching Videos"
|
|
termsText="By joining, you'll receive immediate access to all video tutorials plus new content added weekly. Unsubscribe anytime."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
logoText="Future Coach"
|
|
copyrightText="© 2025 Future Coach. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: 'Learning',
|
|
items: [
|
|
{ label: 'Courses', href: '/courses' },
|
|
{ label: 'Daily Lessons', href: '/daily-lessons' },
|
|
{ label: 'Video Tutorials', href: '/tutorials' },
|
|
{ label: 'Curriculum', href: '/curriculum' },
|
|
{ label: 'Tactical Simulator', href: '/#simulator' }
|
|
]
|
|
},
|
|
{
|
|
title: 'Company',
|
|
items: [
|
|
{ label: 'About Us', href: '/#about' },
|
|
{ label: 'Contact', href: '/#contact' },
|
|
{ label: 'Blog', href: '/#tactical-learning' },
|
|
{ label: 'FAQ', href: '/courses#faq' }
|
|
]
|
|
},
|
|
{
|
|
title: 'Legal',
|
|
items: [
|
|
{ label: 'Privacy Policy', href: '#' },
|
|
{ label: 'Terms of Service', href: '#' },
|
|
{ label: 'Cookie Settings', href: '#' },
|
|
{ label: 'Support', href: 'mailto:support@futurecoach.com' }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |