Initial commit
This commit is contained in:
290
src/app/page.tsx
Normal file
290
src/app/page.tsx
Normal file
@@ -0,0 +1,290 @@
|
||||
"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>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user