Files
3856bd4a-204f-44c8-8783-08f…/src/app/page.tsx
2026-01-02 18:21:15 +00:00

290 lines
11 KiB
TypeScript

"use client"
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import ContactInline from '@/components/sections/contact/ContactInline';
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Zap, Trophy, BarChart3, MessageSquare, Users, Star, Award, Heart, Twitch, Youtube, Twitter, MessageCircle, Instagram } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="small"
sizing="mediumLarge"
background="noiseGradient"
cardStyle="elevated-accent-light"
primaryButtonStyle="outline"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarStyleApple
brandName="Smeagol"
navItems={[
{ name: "About", id: "about" },
{ name: "Highlights", id: "highlights" },
{ name: "Community", id: "testimonials" },
{ name: "Contact", id: "contact" }
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardCarousel
title="Vitaliy The Smeagol Gollum"
description="Elite CS2 Professional Player. Clutch Moments. Championship Mindset. Pure Precision."
tag="CS2 Esports"
tagIcon={Zap}
mediaItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378006073-wmdd1wwk.jpg",
imageAlt: "CS2 competitive gameplay moment"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378006709-cqiicab7.jpg",
imageAlt: "Esports tournament action"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378007410-7uhr9kk0.jpg",
imageAlt: "Professional gaming setup"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378007942-j2x56iqy.jpg",
imageAlt: "Arena competitive environment"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378008511-alrwyp5w.jpg",
imageAlt: "Professional esports equipment"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378006073-wmdd1wwk.jpg",
imageAlt: "High-level gameplay skills"
}
]}
buttons={[
{ text: "Follow on Twitch", href: "https://twitch.tv" },
{ text: "Contact for Sponsorship", href: "contact" }
]}
/>
</div>
<div id="about" data-section="about">
<TextAbout
title="From passionate gamer to professional competitor. Vitaliy Smeagol Gollum represents the pinnacle of CS2 skill, dedication, and competitive spirit in modern esports."
useInvertedBackground="noInvert"
buttons={[
{ text: "View Full Bio", href: "https://example.com/bio" }
]}
/>
</div>
<div id="highlights" data-section="highlights">
<FeatureCardTwelve
title="Career Achievements"
description="Competitive milestones and recognition in the CS2 esports scene"
tag="Accomplishments"
tagIcon={Trophy}
features={[
{
id: "tournaments",
label: "12+",
title: "Major Tournament Victories",
items: [
"Championship wins in tier-1 competitions",
"MVP awards across multiple events",
"International recognition and respect",
"Consistent podium finishes"
]
},
{
id: "stats",
label: "1.28",
title: "Average Kill-Death Ratio",
items: [
"Top 5% player performance globally",
"Consistent clutch moments",
"High-pressure tournament success",
"Proven reliability in crucial rounds"
]
},
{
id: "community",
label: "250K+",
title: "Followers Across Platforms",
items: [
"Strong Twitch streaming presence",
"Active YouTube community",
"Engaged Discord server",
"Growing social media influence"
]
}
]}
animationType="opacity"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardSeven
title="Competitive Impact"
description="Real-time statistics showcasing performance excellence"
tag="Stats"
tagIcon={BarChart3}
metrics={[
{
id: "headshots",
value: "58%",
title: "Average Headshot Percentage",
items: [
"Precision and accuracy mastery",
"Technical skill refinement",
"Tournament-level consistency"
]
},
{
id: "rounds",
value: "2800+",
title: "Professional Competitive Rounds",
items: [
"Years of high-level competition",
"Extensive tournament experience",
"Proven battle-tested player"
]
},
{
id: "titles",
value: "15",
title: "Tournament Titles Won",
items: [
"Major championship victories",
"International recognition",
"Career peak achievements"
]
},
{
id: "rating",
value: "1.05",
title: "HLTV 2.0 Rating Average",
items: [
"Positive round impact metric",
"Valuable team contribution",
"Consistent high performance"
]
}
]}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
title="Community & Team Voices"
description="What teammates, coaches, and the community say about Vitaliy"
tag="Testimonials"
tagIcon={MessageSquare}
testimonials={[
{
id: "1",
name: "Alex Petrov",
role: "Team Coach",
testimonial: "Smeagol is the most dedicated player I've worked with. His game sense, mechanical skill, and willingness to improve set him apart as a true professional.",
icon: Users,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378010099-aefuzubf.jpg"
},
{
id: "2",
name: "Dmitri Sokolov",
role: "Teammate",
testimonial: "Playing alongside Vitaliy elevates everyone's game. His presence creates opportunities and his clutch plays have won us countless rounds we had no business winning.",
icon: Star,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378009506-razcimvd.jpg"
},
{
id: "3",
name: "Marina Volkova",
role: "Esports Organization Director",
testimonial: "Vitaliy represents the brand perfectly. Professional, skilled, and incredibly popular. A player any organization would be honored to represent.",
icon: Award,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378011258-c7lbt1si.jpg"
},
{
id: "4",
name: "Igor Kozlov",
role: "Gaming Community Manager",
testimonial: "The CS2 community respects Smeagol. His streaming content is educational, his gameplay is entertaining, and his character is impeccable.",
icon: Heart,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767378010628-m83xd3m3.jpg"
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="contact" data-section="contact">
<ContactInline
text="Join the community and stay updated on tournaments, streams, and exclusive content"
inputPlaceholder="Enter your email address"
buttonText="Subscribe"
useInvertedBackground="noInvert"
animationType="entrance-slide"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseSocial
logoText="Smeagol"
description="Professional CS2 esports player dedicated to competitive excellence and community engagement. Follow for tournaments, streams, and behind-the-scenes content."
copyrightText="© 2025 Vitaliy Smeagol Gollum. All rights reserved."
columns={[
{
title: "Community",
items: [
{ label: "Twitch", href: "https://twitch.tv" },
{ label: "YouTube", href: "https://youtube.com" },
{ label: "Discord", href: "https://discord.com" },
{ label: "Twitter", href: "https://twitter.com" }
]
},
{
title: "Resources",
items: [
{ label: "Highlights", href: "highlights" },
{ label: "Schedule", href: "https://example.com/schedule" },
{ label: "Merch Store", href: "https://example.com/merch" }
]
},
{
title: "Business",
items: [
{ label: "Sponsorships", href: "contact" },
{ label: "Collaborations", href: "contact" },
{ label: "Media Kit", href: "https://example.com/mediakit" }
]
}
]}
socialLinks={[
{ icon: Twitch, href: "https://twitch.tv", ariaLabel: "Twitch" },
{ icon: Youtube, href: "https://youtube.com", ariaLabel: "YouTube" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: MessageCircle, href: "https://discord.com", ariaLabel: "Discord" },
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" }
]}
/>
</div>
</ThemeProvider>
);
}