283 lines
16 KiB
TypeScript
283 lines
16 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||
import { Flag, History, Trophy } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="elastic-effect"
|
||
defaultTextAnimation="entrance-slide"
|
||
borderRadius="rounded"
|
||
contentWidth="small"
|
||
sizing="largeSizeMediumTitles"
|
||
background="none"
|
||
cardStyle="outline"
|
||
primaryButtonStyle="diagonal-gradient"
|
||
secondaryButtonStyle="solid"
|
||
headingFontWeight="extrabold"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingOverlay
|
||
navItems={[
|
||
{
|
||
name: "Home", id: "#home"},
|
||
{
|
||
name: "About", id: "#about"},
|
||
{
|
||
name: "Matches", id: "#matches"},
|
||
{
|
||
name: "Stats", id: "#stats"},
|
||
{
|
||
name: "Fans Say", id: "#testimonials"},
|
||
{
|
||
name: "FAQ", id: "#faq"},
|
||
{
|
||
name: "Contact", id: "#contact"},
|
||
]}
|
||
logoSrc="http://img.b2bpic.net/free-vector/hand-drawn-football-soccer-club-logo_23-2149313711.jpg"
|
||
logoAlt="World Cup Hub Logo"
|
||
brandName="World Cup Hub"
|
||
/>
|
||
</div>
|
||
|
||
<div id="home" data-section="home">
|
||
<HeroBillboardCarousel
|
||
background={{
|
||
variant: "radial-gradient"}}
|
||
title="FIFA World Cup Hub"
|
||
description="Your ultimate destination for match results, detailed stats, and historical archives of the greatest football tournament."
|
||
buttons={[
|
||
{
|
||
text: "Explore Matches", href: "#matches"},
|
||
{
|
||
text: "View Stats", href: "#stats"},
|
||
]}
|
||
mediaItems={[
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/soccer-fans-cheering-their-team-stadium_23-2151536119.jpg", imageAlt: "Football stadium with cheering crowd and lights"},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-neon-style_23-2151827409.jpg", imageAlt: "Soccer player celebrating a goal in a stadium"},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-happy-women-holding-cup_23-2148634687.jpg", imageAlt: "Dynamic action shot from a World Cup match"},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/ball-guy-soccer-man-playing_1368-1897.jpg", imageAlt: "Golden World Cup trophy on display"},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/soccer-players-action-professional-stadium_654080-1178.jpg", imageAlt: "Team celebrating after scoring a goal"},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-colombian-national-soccer-team_23-2149734074.jpg", imageAlt: "Fans with flags cheering in a packed stadium"},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<SplitAbout
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
title="Beyond the Goals: The World Cup Unveiled"
|
||
description="Dive deep into every FIFA World Cup tournament, from legendary matches to unforgettable moments. Our platform provides comprehensive data, historical archives, and in-depth analysis for football enthusiasts worldwide."
|
||
bulletPoints={[
|
||
{
|
||
title: "Match Details", description: "Comprehensive data for every game: teams, scores, dates, venues, and more."},
|
||
{
|
||
title: "Historical Archives", description: "Browse past tournaments by year, relive classic matches, and discover forgotten heroes."},
|
||
{
|
||
title: "Player & Team Stats", description: "Track top goal scorers, team performance metrics, and individual player achievements."},
|
||
{
|
||
title: "Interactive Search", description: "Quickly find matches, teams, players, or tournaments with our powerful search tools."},
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/still-life-colombian-national-soccer-team_23-2149734073.jpg"
|
||
imageAlt="Historical World Cup trophy with a football background"
|
||
mediaAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features">
|
||
<FeatureBento
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
features={[
|
||
{
|
||
title: "Detailed Match Pages", description: "Every match, every detail. Get scores, lineups, goal scorers, and more.", bentoComponent: "reveal-icon", icon: Trophy
|
||
},
|
||
{
|
||
title: "Historical Archives", description: "Journey through World Cup history, year by year, tournament by tournament.", bentoComponent: "reveal-icon", icon: History
|
||
},
|
||
{
|
||
title: "Top Scorer Stats", description: "Track the Golden Boot contenders and all-time leading goal scorers with interactive charts.", bentoComponent: "animated-bar-chart"
|
||
},
|
||
{
|
||
title: "Team Flags & Profiles", description: "Discover participating nations with their flags and tournament history.", bentoComponent: "reveal-icon", icon: Flag
|
||
},
|
||
]}
|
||
title="All the Data, All the Passion"
|
||
description="Explore detailed match pages, filter by tournament year, analyze top scorer statistics, and discover team flags from every World Cup edition."
|
||
/>
|
||
</div>
|
||
|
||
<div id="matches" data-section="matches">
|
||
<ProductCardThree
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
gridVariant="three-columns-all-equal-width"
|
||
useInvertedBackground={false}
|
||
products={[
|
||
{
|
||
id: "match-1", name: "Argentina 3 - 3 France (4-2 PSO)", price: "2022 Final", imageSrc: "http://img.b2bpic.net/free-photo/spain-vs-switzerland_187299-31172.jpg", imageAlt: "Argentina vs France World Cup Final 2022"},
|
||
{
|
||
id: "match-2", name: "Brazil 1 - 7 Germany", price: "2014 Semi-final", imageSrc: "http://img.b2bpic.net/free-photo/ghana-vs-croatia-football_187299-32095.jpg", imageAlt: "Brazil vs Germany World Cup Semi-final 2014"},
|
||
{
|
||
id: "match-3", name: "Italy 0 - 0 Brazil (2-3 PSO)", price: "1994 Final", imageSrc: "http://img.b2bpic.net/free-photo/soccer-fans-cheering-their-team-stadium_23-2151536180.jpg", imageAlt: "Italy vs Brazil World Cup Final 1994"},
|
||
{
|
||
id: "match-4", name: "England 2 - 4 Germany", price: "2010 Round of 16", imageSrc: "http://img.b2bpic.net/free-photo/men-playing-rugby-field_23-2150062039.jpg", imageAlt: "England vs Germany World Cup 2010"},
|
||
{
|
||
id: "match-5", name: "Spain 1 - 0 Netherlands", price: "2010 Final", imageSrc: "http://img.b2bpic.net/free-photo/soccer-game-concept_23-2151043781.jpg", imageAlt: "Spain vs Netherlands World Cup Final 2010"},
|
||
{
|
||
id: "match-6", name: "USA 2 - 0 Mexico", price: "2002 Round of 16", imageSrc: "http://img.b2bpic.net/free-photo/morocco-vs-united-states-football_187299-32225.jpg", imageAlt: "USA vs Mexico World Cup 2002"},
|
||
]}
|
||
title="Recent & Upcoming Matches"
|
||
description="Stay up-to-date with the latest World Cup results and upcoming fixtures. Click any match for full details including goal scorers and more."
|
||
/>
|
||
</div>
|
||
|
||
<div id="stats" data-section="stats">
|
||
<MetricCardSeven
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
metrics={[
|
||
{
|
||
id: "total-goals", value: "2720+", title: "Total Goals Scored", items: [
|
||
"Across all tournaments", "Since 1930", "An ever-growing legacy"],
|
||
},
|
||
{
|
||
id: "most-titles", value: "5", title: "Most Titles (Brazil)", items: [
|
||
"Record-holding nation", "Consistent performance", "Legacy of champions"],
|
||
},
|
||
{
|
||
id: "top-scorer", value: "16", title: "Klose's Record Goals", items: [
|
||
"Miroslav Klose", "Most World Cup Goals", "Across 4 tournaments"],
|
||
},
|
||
{
|
||
id: "attendance", value: "3.5 Billion+", title: "Cumulative Viewers", items: [
|
||
"For a single tournament", "Global reach", "The world watches"],
|
||
},
|
||
]}
|
||
title="Tournament Highlights & Records"
|
||
description="Relive the greatest moments and marvel at the records set throughout FIFA World Cup history."
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardTen
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
testimonials={[
|
||
{
|
||
id: "1", title: "Unmatched Coverage!", quote: "This website is simply incredible! The depth of match data and historical archives is unmatched. Every stat I could ever want, right at my fingertips. A true gem for any football fan.", name: "David S.", role: "Die-hard Fan", imageSrc: "http://img.b2bpic.net/free-photo/soccer-fans-cheering-their-team-stadium_23-2151536095.jpg", imageAlt: "Portrait of David S., a die-hard football fan"},
|
||
{
|
||
id: "2", title: "Essential for Analysis", quote: "As a sports analyst, I rely on accurate and comprehensive data. The World Cup Hub delivers on all fronts, making my research and commentary so much easier. Highly recommended for professionals.", name: "Sarah J.", role: "Sports Analyst", imageSrc: "http://img.b2bpic.net/free-photo/anxious-young-caucasian-sporty-girl-with-braces-with-jumping-rope-around-neck-wearing-headband-wristbands-holds-ball-gestures-silence-sign-looking-side-white-wall_141793-39178.jpg", imageAlt: "Portrait of Sarah J., a sports analyst"},
|
||
{
|
||
id: "3", title: "Relive the Magic", quote: "Bringing back memories of past World Cups has never been easier. The archive feature is fantastic, allowing my family and I to relive iconic moments together. Truly captures the spirit of the game!", name: "Michael T.", role: "Family Man & Fan", imageSrc: "http://img.b2bpic.net/free-photo/people-attending-enjoying-soccer-match_23-2150888331.jpg", imageAlt: "Portrait of Michael T., a family man and fan"},
|
||
{
|
||
id: "4", title: "A Coach's Dream", quote: "The detailed match statistics and player data are invaluable for coaching. I use this site to study strategies and learn from historical games. It’s an essential tool for aspiring coaches.", name: "Coach Maria R.", role: "Youth Football Coach", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-sitting-grandstands_23-2149743687.jpg", imageAlt: "Portrait of Coach Maria R., a youth football coach"},
|
||
{
|
||
id: "5", title: "My Daily Football Fix", quote: "From checking the latest scores to diving into the archives, this site is my daily go-to for all things World Cup. The modern design and ease of navigation make it a joy to use. Simply the best!", name: "Omar K.", role: "Football Blogger", imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-athlete-girl-workout-home-watches-fitness-videos-laptop-lying-rubber-mat_1258-182647.jpg", imageAlt: "Portrait of Omar K., a football blogger"},
|
||
{
|
||
id: "6", title: "Community & Stats Combined", quote: "The way this site combines intricate stats with an intuitive interface is genius. It feels like a community hub for football lovers, and I always discover something new here.", name: "Elena P.", role: "Football Enthusiast", imageSrc: "http://img.b2bpic.net/free-photo/enthusiast-soccer-fan-clenching-fist_329181-18326.jpg", imageAlt: "Portrait of Elena P., a football enthusiast"},
|
||
]}
|
||
title="What the Fans Say"
|
||
description="Hear from passionate football fans and experts about their ultimate World Cup experience and why our hub is their go-to source."
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqDouble
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
faqs={[
|
||
{
|
||
id: "faq-1", title: "How often is the FIFA World Cup held?", content: "The FIFA World Cup tournament is held every four years, bringing together national teams from around the globe to compete for the prestigious title."},
|
||
{
|
||
id: "faq-2", title: "Can I filter matches by specific years or stages?", content: "Yes, our platform offers robust filtering options allowing you to browse matches by tournament year, stage (e.g., group stage, knockout rounds), and even specific teams."},
|
||
{
|
||
id: "faq-3", title: "What kind of stats are available for players?", content: "You can find detailed player statistics including goal scorers, assists, yellow cards, red cards, and minutes played for each tournament and match. Top scorer lists are also available."},
|
||
{
|
||
id: "faq-4", title: "Is there a dark mode option for the website?", content: "Yes, our website supports both dark and light modes, which can be toggled to suit your viewing preference for an optimal experience."},
|
||
]}
|
||
title="Frequently Asked Questions"
|
||
description="Find answers to common questions about our World Cup data, website features, and historical information."
|
||
faqsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactCenter
|
||
useInvertedBackground={false}
|
||
background={{
|
||
variant: "sparkles-gradient"}}
|
||
tag="Get in Touch"
|
||
title="Have a Question or Suggestion?"
|
||
description="Your feedback helps us improve the ultimate World Cup experience. Reach out to us with any inquiries or feature requests."
|
||
inputPlaceholder="Enter your email for updates"
|
||
buttonText="Subscribe"
|
||
termsText="By clicking Subscribe you're confirming that you agree with our Privacy Policy."
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterBaseReveal
|
||
logoText="World Cup Hub"
|
||
columns={[
|
||
{
|
||
title: "Navigate", items: [
|
||
{
|
||
label: "Home", href: "#home"},
|
||
{
|
||
label: "Matches", href: "#matches"},
|
||
{
|
||
label: "Stats", href: "#stats"},
|
||
{
|
||
label: "Archives", href: "#archives"},
|
||
],
|
||
},
|
||
{
|
||
title: "Resources", items: [
|
||
{
|
||
label: "FAQ", href: "#faq"},
|
||
{
|
||
label: "About Us", href: "#about"},
|
||
{
|
||
label: "Contact", href: "#contact"},
|
||
],
|
||
},
|
||
{
|
||
title: "Legal", items: [
|
||
{
|
||
label: "Privacy Policy", href: "/privacy"},
|
||
{
|
||
label: "Terms of Service", href: "/terms"},
|
||
],
|
||
},
|
||
]}
|
||
copyrightText="© 2024 World Cup Hub. All rights reserved."
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|