Merge version_1 into main #3

Merged
bender merged 5 commits from version_1 into main 2026-03-12 16:42:15 +00:00
5 changed files with 207 additions and 624 deletions

View File

@@ -12,8 +12,8 @@ export default function CreateChallengePage() {
{ name: "Home", id: "/" },
{ name: "Create Challenge", id: "/create-challenge" },
{ name: "Leaderboard", id: "leaderboard" },
{ name: "Tournaments", id: "tournaments" },
{ name: "Profile", id: "profile" },
{ name: "Tournaments", id: "/tournaments" },
{ name: "Profile", id: "/profile" },
];
const footerColumns = [
@@ -21,14 +21,14 @@ export default function CreateChallengePage() {
title: "Battle", items: [
{ label: "Create Challenge", href: "/create-challenge" },
{ label: "Active Battles", href: "/" },
{ label: "Tournament", href: "tournaments" },
{ label: "Tournament", href: "/tournaments" },
],
},
{
title: "Account", items: [
{ label: "My Profile", href: "profile" },
{ label: "My Profile", href: "/profile" },
{ label: "Leaderboard", href: "leaderboard" },
{ label: "Purchase Coins", href: "/" },
{ label: "Purchase Coins", href: "pricing" },
],
},
{
@@ -68,6 +68,7 @@ export default function CreateChallengePage() {
tag="Challenge Creation"
tagIcon={Zap}
background={{ variant: "sparkles-gradient" }}
mediaAnimation="slide-up"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-vector/gradient-pack-twitch-panels_23-2149200772.jpg", imageAlt: "competitive gaming battle arena interface"},
@@ -108,6 +109,7 @@ export default function CreateChallengePage() {
imagePosition="right"
textboxLayout="default"
useInvertedBackground={false}
mediaAnimation="slide-up"
/>
</div>
@@ -136,6 +138,7 @@ export default function CreateChallengePage() {
imagePosition="left"
textboxLayout="default"
useInvertedBackground={true}
mediaAnimation="slide-up"
/>
</div>

View File

@@ -11,38 +11,34 @@ import TestimonialCardSixteen from "@/components/sections/testimonial/Testimonia
import FaqDouble from "@/components/sections/faq/FaqDouble";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FooterBase from "@/components/sections/footer/FooterBase";
import Link from "next/link";
import { Zap, Flame, Sparkles, Coins, HelpCircle, Users, Upload, Vote, Trophy, TrendingUp } from "lucide-react";
import { Zap, Sparkles, Flame, Upload, Vote, Trophy, TrendingUp, HelpCircle, Users } from "lucide-react";
export default function HomePage() {
export default function Home() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Create Challenge", id: "/create-challenge" },
{ name: "Leaderboard", id: "leaderboard" },
{ name: "Tournaments", id: "tournaments" },
{ name: "Profile", id: "profile" },
{ name: "Tournaments", id: "/tournaments" },
{ name: "Profile", id: "/profile" },
];
const footerColumns = [
{
title: "Battle",
items: [
title: "Battle", items: [
{ label: "Create Challenge", href: "/create-challenge" },
{ label: "Active Battles", href: "/" },
{ label: "Tournament", href: "tournaments" },
{ label: "Tournament", href: "/tournaments" },
],
},
{
title: "Account",
items: [
{ label: "My Profile", href: "profile" },
title: "Account", items: [
{ label: "My Profile", href: "/profile" },
{ label: "Leaderboard", href: "leaderboard" },
{ label: "Purchase Coins", href: "/" },
{ label: "Purchase Coins", href: "pricing" },
],
},
{
title: "Support",
items: [
title: "Support", items: [
{ label: "Help Center", href: "#faq" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
@@ -78,27 +74,18 @@ export default function HomePage() {
tag="Competitive Gaming"
tagIcon={Zap}
background={{ variant: "sparkles-gradient" }}
mediaAnimation="slide-up"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-vector/gradient-pack-twitch-panels_23-2149200772.jpg?_wi=1",
imageAlt: "competitive gaming battle arena interface",
},
imageSrc: "http://img.b2bpic.net/free-vector/gradient-pack-twitch-panels_23-2149200772.jpg", imageAlt: "competitive gaming battle arena interface"},
{
imageSrc: "http://img.b2bpic.net/free-photo/sunset-projector-lamp-product-backdrop_53876-108123.jpg?_wi=1",
imageAlt: "creator clash competition showcase",
},
imageSrc: "http://img.b2bpic.net/free-photo/sunset-projector-lamp-product-backdrop_53876-108123.jpg", imageAlt: "creator clash competition showcase"},
{
imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-watching-match-waiting-goal_329181-16802.jpg?_wi=1",
imageAlt: "gaming tournament winner celebration",
},
imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-watching-match-waiting-goal_329181-16802.jpg", imageAlt: "gaming tournament winner celebration"},
{
imageSrc: "http://img.b2bpic.net/free-photo/group-fans-are-watching-soccer-tv_1157-28501.jpg?_wi=1",
imageAlt: "digital voting system interface",
},
imageSrc: "http://img.b2bpic.net/free-photo/group-fans-are-watching-soccer-tv_1157-28501.jpg", imageAlt: "digital voting system interface"},
{
imageSrc: "http://img.b2bpic.net/free-vector/bitcoin-digital-currency-exchange-money_24877-53117.jpg?_wi=1",
imageAlt: "cryptocurrency coins digital currency",
},
imageSrc: "http://img.b2bpic.net/free-vector/bitcoin-digital-currency-exchange-money_24877-53117.jpg", imageAlt: "cryptocurrency coins digital currency"},
]}
buttons={[
{ text: "Start Battle", href: "/" },
@@ -116,40 +103,16 @@ export default function HomePage() {
features={[
{
id: 1,
tag: "Vote & Win",
title: "Cast Your Vote",
subtitle: "Spend 1 coin to vote for your favorite",
description: "Every vote counts towards the final winner. Choose wisely and back your favorite creator. Each vote costs 1 coin from your balance. Voting closes when the timer expires and the community declares a winner.",
imageSrc: "http://img.b2bpic.net/free-photo/atm-operation-bank_1359-1208.jpg",
imageAlt: "vote button interface voting system",
},
tag: "Vote & Win", title: "Cast Your Vote", subtitle: "Spend 1 coin to vote for your favorite", description: "Every vote counts towards the final winner. Choose wisely and back your favorite creator. Each vote costs 1 coin from your balance. Voting closes when the timer expires and the community declares a winner.", imageSrc: "http://img.b2bpic.net/free-photo/atm-operation-bank_1359-1208.jpg", imageAlt: "vote button interface voting system"},
{
id: 2,
tag: "Share & Earn",
title: "Share Battle Link",
subtitle: "Earn 1 coin instantly",
description: "Share battles with friends and earn bonus coins. Every share spreads the competition and rewards you for promoting battles. Share to social media or copy the link directly.",
imageSrc: "http://img.b2bpic.net/free-vector/flat-web-button-collection_23-2147954772.jpg",
imageAlt: "social media sharing buttons interface",
},
tag: "Share & Earn", title: "Share Battle Link", subtitle: "Earn 1 coin instantly", description: "Share battles with friends and earn bonus coins. Every share spreads the competition and rewards you for promoting battles. Share to social media or copy the link directly.", imageSrc: "http://img.b2bpic.net/free-vector/flat-web-button-collection_23-2147954772.jpg", imageAlt: "social media sharing buttons interface"},
{
id: 3,
tag: "Comment System",
title: "Leave Comments",
subtitle: "Engage with the community",
description: "Comment on battles to hype up your favorite creators and engage in friendly competition. Build community reputation through meaningful feedback and encouragement.",
imageSrc: "http://img.b2bpic.net/free-vector/creative-web-testimonial-design_23-2147947091.jpg",
imageAlt: "comment section social platform",
},
tag: "Comment System", title: "Leave Comments", subtitle: "Engage with the community", description: "Comment on battles to hype up your favorite creators and engage in friendly competition. Build community reputation through meaningful feedback and encouragement.", imageSrc: "http://img.b2bpic.net/free-vector/creative-web-testimonial-design_23-2147947091.jpg", imageAlt: "comment section social platform"},
{
id: 4,
tag: "Countdown Timer",
title: "Time-Limited Battles",
subtitle: "24h, 48h, or 72h durations",
description: "Watch the countdown as submissions come in. Faster voting periods create urgency and excitement. Timer controls when voting opens and automatically closes for final results.",
imageSrc: "http://img.b2bpic.net/free-vector/last-few-days-left-tag-template-business-marketing_1017-62883.jpg",
imageAlt: "countdown timer digital clock",
},
tag: "Countdown Timer", title: "Time-Limited Battles", subtitle: "24h, 48h, or 72h durations", description: "Watch the countdown as submissions come in. Faster voting periods create urgency and excitement. Timer controls when voting opens and automatically closes for final results.", imageSrc: "http://img.b2bpic.net/free-vector/last-few-days-left-tag-template-business-marketing_1017-62883.jpg", imageAlt: "countdown timer digital clock"},
]}
textboxLayout="default"
useInvertedBackground={false}
@@ -164,36 +127,27 @@ export default function HomePage() {
tagIcon={Sparkles}
bulletPoints={[
{
title: "Create Challenges",
description: "Set skill category, title, description, time limit, and coin rewards. Pay 5 coins to publish your challenge to the arena.",
icon: Zap,
title: "Create Challenges", description: "Set skill category, title, description, time limit, and coin rewards. Pay 5 coins to publish your challenge to the arena.", icon: Zap,
},
{
title: "Accept & Submit",
description: "Players accept challenges as Player B. Both players upload submissions and descriptions. Voting begins immediately after both submit.",
icon: Upload,
title: "Accept & Submit", description: "Players accept challenges as Player B. Both players upload submissions and descriptions. Voting begins immediately after both submit.", icon: Upload,
},
{
title: "Community Voting",
description: "Users vote with coins. Each vote costs 1 coin and counts towards the final tally. Winner determined by highest vote count when timer expires.",
icon: Vote,
title: "Community Voting", description: "Users vote with coins. Each vote costs 1 coin and counts towards the final tally. Winner determined by highest vote count when timer expires.", icon: Vote,
},
{
title: "Earn Rewards",
description: "Winners receive all reward coins plus 5 bonus coins. Coins can be used for voting, creating challenges, or purchasing premium plans.",
icon: Trophy,
title: "Earn Rewards", description: "Winners receive all reward coins plus 5 bonus coins. Coins can be used for voting, creating challenges, or purchasing premium plans.", icon: Trophy,
},
{
title: "Track Stats",
description: "View your profile with battles won/lost, badges earned, coins balance, and detailed battle history and achievements.",
icon: TrendingUp,
title: "Track Stats", description: "View your profile with battles won/lost, badges earned, coins balance, and detailed battle history and achievements.", icon: TrendingUp,
},
]}
imageSrc="http://img.b2bpic.net/free-vector/artificial-intelligence-youtube-channel-art_23-2150363645.jpg?_wi=1"
imageSrc="http://img.b2bpic.net/free-vector/artificial-intelligence-youtube-channel-art_23-2150363645.jpg"
imageAlt="workflow steps process diagram"
imagePosition="right"
textboxLayout="default"
useInvertedBackground={true}
mediaAnimation="slide-up"
/>
</div>
@@ -202,32 +156,14 @@ export default function HomePage() {
title="Coin Economy Power Stats"
description="Track your earnings and spending across the entire platform"
tag="Economy"
tagIcon={Coins}
tagIcon={Zap}
metrics={[
{
id: "1",
value: "2 Coins",
title: "Daily Login Reward",
description: "Free coins every day",
imageSrc: "http://img.b2bpic.net/free-photo/hipster-with-smartphone-before-new-year-party_23-2147720560.jpg?_wi=1",
imageAlt: "daily bonus reward celebration",
},
id: "1", value: "2 Coins", title: "Daily Login Reward", description: "Free coins every day", imageSrc: "http://img.b2bpic.net/free-photo/hipster-with-smartphone-before-new-year-party_23-2147720560.jpg", imageAlt: "daily bonus reward celebration"},
{
id: "2",
value: "5 Coins",
title: "Challenge Creation Cost",
description: "Launch your first battle",
imageSrc: "http://img.b2bpic.net/free-vector/divorce-mediation-onboarding-screens_23-2148604616.jpg?_wi=1",
imageAlt: "create new challenge gaming",
},
id: "2", value: "5 Coins", title: "Challenge Creation Cost", description: "Launch your first battle", imageSrc: "http://img.b2bpic.net/free-vector/divorce-mediation-onboarding-screens_23-2148604616.jpg", imageAlt: "create new challenge gaming"},
{
id: "3",
value: "100 Coins",
title: "Tournament Winner Prize",
description: "Plus champion badge",
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-father-s-day-badges-set_23-2148513184.jpg?_wi=1",
imageAlt: "tournament championship trophy winner",
},
id: "3", value: "100 Coins", title: "Tournament Winner Prize", description: "Plus champion badge", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-father-s-day-badges-set_23-2148513184.jpg", imageAlt: "tournament championship trophy winner"},
]}
animationType="slide-up"
textboxLayout="default"
@@ -243,56 +179,24 @@ export default function HomePage() {
tagIcon={Zap}
plans={[
{
id: "1",
badge: "Starter",
badgeIcon: Sparkles,
price: "$1",
subtitle: "Perfect for testing",
features: ["10 Coins", "Basic voting power", "Standard profile", "Vote on all battles"],
id: "1", badge: "Starter", badgeIcon: Sparkles,
price: "$1", subtitle: "Perfect for testing", features: [
"10 Coins", "Basic voting power", "Standard profile", "Vote on all battles"],
},
{
id: "2",
badge: "Popular",
badgeIcon: Sparkles,
price: "$5",
subtitle: "Best value for active players",
features: [
"60 Coins",
"Bonus voting power",
"Challenge creation",
"Standard badge display",
"Email support",
],
id: "2", badge: "Popular", badgeIcon: Zap,
price: "$5", subtitle: "Best value for active players", features: [
"60 Coins", "Bonus voting power", "Challenge creation", "Standard badge display", "Email support"],
},
{
id: "3",
badge: "Ultimate",
badgeIcon: Sparkles,
price: "$10",
subtitle: "Maximum competitive advantage",
features: [
"130 Coins",
"Premium voting power",
"Unlimited challenges",
"Gold badge display",
"Priority support",
"Advanced analytics",
],
id: "3", badge: "Ultimate", badgeIcon: Trophy,
price: "$10", subtitle: "Maximum competitive advantage", features: [
"130 Coins", "Premium voting power", "Unlimited challenges", "Gold badge display", "Priority support", "Advanced analytics"],
},
{
id: "4",
badge: "Elite Monthly",
badgeIcon: Flame,
price: "$12/mo",
subtitle: "Exclusive premium benefits",
features: [
"Double coin rewards",
"Featured leaderboard",
"Exclusive tournaments",
"Animated avatar effects",
"VIP voting badge",
"Priority matching",
],
id: "4", badge: "Elite Monthly", badgeIcon: Flame,
price: "$12/mo", subtitle: "Exclusive premium benefits", features: [
"Double coin rewards", "Featured leaderboard", "Exclusive tournaments", "Animated avatar effects", "VIP voting badge", "Priority matching"],
},
]}
animationType="slide-up"
@@ -306,44 +210,20 @@ export default function HomePage() {
title="Champion Stories"
description="Hear from our community legends who've dominated the arena"
tag="Community"
tagIcon={Sparkles}
tagIcon={Zap}
testimonials={[
{
id: "1",
name: "Alex Chen",
role: "Coding Champion",
company: "Tech Talents",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-man-with-laptop-desk_23-2147862277.jpg?_wi=1",
imageAlt: "professional programmer portrait",
},
id: "1", name: "Alex Chen", role: "Coding Champion", company: "Tech Talents", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-man-with-laptop-desk_23-2147862277.jpg", imageAlt: "professional programmer portrait"},
{
id: "2",
name: "Maya Rodriguez",
role: "Design Master",
company: "Creative Minds",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-redhead-woman-black-wall_176420-16401.jpg?_wi=1",
imageAlt: "creative designer professional portrait",
},
id: "2", name: "Maya Rodriguez", role: "Design Master", company: "Creative Minds", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-redhead-woman-black-wall_176420-16401.jpg", imageAlt: "creative designer professional portrait"},
{
id: "3",
name: "Jordan Williams",
role: "Meme Legend",
company: "Content Kings",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-man-sitting-cafe-with-laptop_273609-11291.jpg?_wi=1",
imageAlt: "content creator portrait headshot",
},
id: "3", name: "Jordan Williams", role: "Meme Legend", company: "Content Kings", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-man-sitting-cafe-with-laptop_273609-11291.jpg", imageAlt: "content creator portrait headshot"},
{
id: "4",
name: "Sofia Martinez",
role: "Video Producer",
company: "Media Studios",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-male-singer-happily-looking-camera-recording-song-new-album-sound-studio_574295-4362.jpg?_wi=1",
imageAlt: "video producer filmmaker portrait",
},
id: "4", name: "Sofia Martinez", role: "Video Producer", company: "Media Studios", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-male-singer-happily-looking-camera-recording-song-new-album-sound-studio_574295-4362.jpg", imageAlt: "video producer filmmaker portrait"},
]}
kpiItems={[
{ value: "50K+", label: "Active Competitors" },
@@ -364,53 +244,21 @@ export default function HomePage() {
tagIcon={HelpCircle}
faqs={[
{
id: "1",
title: "How do I create a challenge?",
content:
"Click 'Create Challenge' in the navigation. Select a skill category (design, coding, art, meme, video, music), write your title and description, choose a time limit (24h, 48h, or 72h), and set the coin reward. Pay 5 coins to publish your challenge to the arena where other players can accept it.",
},
id: "1", title: "How do I create a challenge?", content: "Click 'Create Challenge' in the navigation. Select a skill category (design, coding, art, meme, video, music), write your title and description, choose a time limit (24h, 48h, or 72h), and set the coin reward. Pay 5 coins to publish your challenge to the arena where other players can accept it."},
{
id: "2",
title: "How does voting work?",
content:
"Each vote costs 1 coin from your balance. Simply click 'Vote Player A' or 'Vote Player B' on any active battle. Your vote is counted towards the final tally. When the timer expires, the player with the most votes wins and receives all reward coins plus 5 bonus coins.",
},
id: "2", title: "How does voting work?", content: "Each vote costs 1 coin from your balance. Simply click 'Vote Player A' or 'Vote Player B' on any active battle. Your vote is counted towards the final tally. When the timer expires, the player with the most votes wins and receives all reward coins plus 5 bonus coins."},
{
id: "3",
title: "How can I earn coins?",
content:
"Earn coins by: Daily login (2 coins), Sharing battles (1 coin per share), Inviting friends (5 coins per friend), Winning battles (claim the reward pool). You can also purchase coins directly with credit card, Click, PayMe, or Uzum Pay.",
},
id: "3", title: "How can I earn coins?", content: "Earn coins by: Daily login (2 coins), Sharing battles (1 coin per share), Inviting friends (5 coins per friend), Winning battles (claim the reward pool). You can also purchase coins directly with credit card, Click, PayMe, or Uzum Pay."},
{
id: "4",
title: "What is the Premium PRO plan?",
content:
"$5/month gives you: Unlimited challenge creation, Premium profile badge, Advanced statistics dashboard, Priority battle matching, and exclusive tournaments access.",
},
id: "4", title: "What is the Premium PRO plan?", content: "$5/month gives you: Unlimited challenge creation, Premium profile badge, Advanced statistics dashboard, Priority battle matching, and exclusive tournaments access."},
{
id: "5",
title: "What is the Elite plan?",
content:
"$12/month includes everything in PRO plus: Featured profile on leaderboard, Double coin rewards on all wins, Access to exclusive elite tournaments, Special animated avatar effects, VIP voting badge, and dedicated priority support.",
},
id: "5", title: "What is the Elite plan?", content: "$12/month includes everything in PRO plus: Featured profile on leaderboard, Double coin rewards on all wins, Access to exclusive elite tournaments, Special animated avatar effects, VIP voting badge, and dedicated priority support."},
{
id: "6",
title: "How do tournaments work?",
content:
"Weekly tournaments charge 10 coins to join. Compete in bracketed matches. The champion receives 100 coins and a Champion badge. Tournaments run every Sunday and offer the highest stakes and rewards on the platform.",
},
id: "6", title: "How do tournaments work?", content: "Weekly tournaments charge 10 coins to join. Compete in bracketed matches. The champion receives 100 coins and a Champion badge. Tournaments run every Sunday and offer the highest stakes and rewards on the platform."},
{
id: "7",
title: "What badges can I earn?",
content:
"Badges reflect your achievement level: Rookie (beginner), Pro (10+ wins), Master (50+ wins), Champion (tournament winner). Display your badges on your profile to show your competitive status and attract more challengers.",
},
id: "7", title: "What badges can I earn?", content: "Badges reflect your achievement level: Rookie (beginner), Pro (10+ wins), Master (50+ wins), Champion (tournament winner). Display your badges on your profile to show your competitive status and attract more challengers."},
{
id: "8",
title: "Can I withdraw coins?",
content:
"Yes, from your profile page click 'Withdraw Coins'. You can convert earned coins back to cash via the same payment methods used to purchase coins. A small processing fee applies to withdrawals.",
},
id: "8", title: "Can I withdraw coins?", content: "Yes, from your profile page click 'Withdraw Coins'. You can convert earned coins back to cash via the same payment methods used to purchase coins. A small processing fee applies to withdrawals."},
]}
faqsAnimation="slide-up"
textboxLayout="default"
@@ -425,15 +273,7 @@ export default function HomePage() {
tag="Community"
tagIcon={Users}
names={[
"Design Masters",
"Coding Elite",
"Meme Legends",
"Video Artists",
"Music Producers",
"Content Kings",
"Creative Minds",
"Tech Innovators",
]}
"Design Masters", "Coding Elite", "Meme Legends", "Video Artists", "Music Producers", "Content Kings", "Creative Minds", "Tech Innovators"]}
textboxLayout="default"
useInvertedBackground={false}
speed={40}

View File

@@ -3,12 +3,42 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import SplitAbout from "@/components/sections/about/SplitAbout";
import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Trophy, TrendingUp, Zap } from "lucide-react";
import { Zap } from "lucide-react";
export default function ProfilePage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Create Challenge", id: "/create-challenge" },
{ name: "Leaderboard", id: "leaderboard" },
{ name: "Tournaments", id: "/tournaments" },
{ name: "Profile", id: "/profile" },
];
const footerColumns = [
{
title: "Battle", items: [
{ label: "Create Challenge", href: "/create-challenge" },
{ label: "Active Battles", href: "/" },
{ label: "Tournament", href: "/tournaments" },
],
},
{
title: "Account", items: [
{ label: "My Profile", href: "/profile" },
{ label: "Leaderboard", href: "leaderboard" },
{ label: "Purchase Coins", href: "pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#faq" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
@@ -25,133 +55,37 @@ export default function ProfilePage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="SkillFight Arena"
navItems={[
{ name: "Home", id: "/" },
{ name: "Create Challenge", id: "create-challenge" },
{ name: "Leaderboard", id: "leaderboard" },
{ name: "Tournaments", id: "tournaments" },
{ name: "Profile", id: "/profile" },
]}
button={{
text: "Join Battle",
href: "/",
}}
navItems={navItems}
button={{ text: "Join Battle", href: "/" }}
/>
</div>
<div id="profile-overview" data-section="profile-overview">
<div id="profile-stats" data-section="profile-stats">
<SplitAbout
title="Your Battle Profile"
description="Track your competitive journey, achievements, and earning history across SkillFight Arena"
tag="My Stats"
tagIcon={Trophy}
title="Your Profile"
description="Track your competitive journey and achievements"
tag="Player Stats"
tagIcon={Zap}
bulletPoints={[
{
title: "Battles Won",
description: "23 victories across all skill categories",
icon: Trophy,
title: "Battle Record", description: "View your total wins, losses, and battle history", icon: Zap,
},
{
title: "Win Rate",
description: "78% success rate in competitive matches",
icon: TrendingUp,
title: "Coin Balance", description: "Check your available coins and transaction history", icon: Zap,
},
{
title: "Coins Balance",
description: "1,245 coins available for challenges and voting",
icon: Zap,
title: "Badges & Achievements", description: "Showcase your earned badges and competitive milestones", icon: Zap,
},
{
title: "Badges Earned",
description: "Pro, Master, and Tournament Champion badges",
icon: Trophy,
},
{
title: "Community Rank",
description: "#47 on the global leaderboard",
icon: TrendingUp,
title: "Leaderboard Rank", description: "See your global ranking and compare with other players", icon: Zap,
},
]}
imageSrc="http://img.b2bpic.net/free-photo/portrait-happy-man-with-laptop-desk_23-2147862277.jpg?_wi=4"
imageAlt="User profile preview"
imageSrc="http://img.b2bpic.net/free-photo/hipster-with-smartphone-before-new-year-party_23-2147720560.jpg"
imageAlt="player profile achievement showcase"
imagePosition="right"
textboxLayout="default"
useInvertedBackground={true}
/>
</div>
<div id="profile-metrics" data-section="profile-metrics">
<MetricCardEleven
metrics={[
{
id: "1",
value: "23",
title: "Total Wins",
description: "Victories across all categories",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-watching-match-waiting-goal_329181-16802.jpg?_wi=3",
imageAlt: "Battle victories",
},
{
id: "2",
value: "1,245",
title: "Available Coins",
description: "Ready to spend on voting and challenges",
imageSrc: "http://img.b2bpic.net/free-vector/bitcoin-digital-currency-exchange-money_24877-53117.jpg?_wi=2",
imageAlt: "Coin balance",
},
{
id: "3",
value: "78%",
title: "Win Rate",
description: "Your competitive success ratio",
imageSrc: "http://img.b2bpic.net/free-photo/group-fans-are-watching-soccer-tv_1157-28501.jpg?_wi=2",
imageAlt: "Win rate statistics",
},
]}
title="Your Performance Metrics"
description="Comprehensive statistics tracking your competitive progress"
tag="Analytics"
tagIcon={TrendingUp}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="profile-achievements" data-section="profile-achievements">
<FeatureCardNineteen
features={[
{
id: 1,
tag: "Achievement",
title: "Code Master",
subtitle: "Won 10 coding battles",
description: "Demonstrated exceptional programming skills across JavaScript, Python, and web development challenges. Competed against elite developers and maintained consistent victory.",
imageSrc: "http://img.b2bpic.net/free-vector/divorce-mediation-onboarding-screens_23-2148604616.jpg?_wi=2",
},
{
id: 2,
tag: "Achievement",
title: "Design Champion",
subtitle: "Won 8 design battles",
description: "Showcased creative excellence in UI/UX design competitions. Created stunning visual compositions that impressed judges and community voters alike.",
imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-redhead-woman-black-wall_176420-16401.jpg?_wi=4",
},
{
id: 3,
tag: "Achievement",
title: "Community Star",
subtitle: "Earned 500+ community votes",
description: "Built strong community engagement through quality submissions and active participation in voting and commenting on other battles.",
imageSrc: "http://img.b2bpic.net/free-photo/young-man-sitting-cafe-with-laptop_273609-11291.jpg?_wi=4",
},
]}
title="Your Achievements"
description="Badges and milestones earned through your competitive journey"
tag="Accomplishments"
tagIcon={Trophy}
textboxLayout="default"
useInvertedBackground={false}
mediaAnimation="slide-up"
/>
</div>
@@ -159,32 +93,7 @@ export default function ProfilePage() {
<FooterBase
logoText="SkillFight Arena"
copyrightText="© 2025 SkillFight Arena | Battle. Vote. Win."
columns={[
{
title: "Battle",
items: [
{ label: "Create Challenge", href: "create-challenge" },
{ label: "Active Battles", href: "/" },
{ label: "Tournament", href: "tournaments" },
],
},
{
title: "Account",
items: [
{ label: "My Profile", href: "/profile" },
{ label: "Leaderboard", href: "leaderboard" },
{ label: "Purchase Coins", href: "/pricing" },
],
},
{
title: "Support",
items: [
{ label: "Help Center", href: "#faq" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
],
},
]}
columns={footerColumns}
/>
</div>
</ThemeProvider>

View File

@@ -3,13 +3,42 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import FooterBase from "@/components/sections/footer/FooterBase";
import Link from "next/link";
import { Trophy, Zap, HelpCircle } from "lucide-react";
import { Zap, Trophy, Flame } from "lucide-react";
export default function TournamentsPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Create Challenge", id: "/create-challenge" },
{ name: "Leaderboard", id: "leaderboard" },
{ name: "Tournaments", id: "/tournaments" },
{ name: "Profile", id: "/profile" },
];
const footerColumns = [
{
title: "Battle", items: [
{ label: "Create Challenge", href: "/create-challenge" },
{ label: "Active Battles", href: "/" },
{ label: "Tournament", href: "/tournaments" },
],
},
{
title: "Account", items: [
{ label: "My Profile", href: "/profile" },
{ label: "Leaderboard", href: "leaderboard" },
{ label: "Purchase Coins", href: "pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#faq" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
@@ -23,120 +52,40 @@ export default function TournamentsPage() {
secondaryButtonStyle="radial-glow"
headingFontWeight="medium"
>
{/* Navbar */}
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="SkillFight Arena"
navItems={[
{ name: "Home", id: "/" },
{ name: "Create Challenge", id: "create-challenge" },
{ name: "Leaderboard", id: "/leaderboard" },
{ name: "Tournaments", id: "/tournaments" },
{ name: "Profile", id: "profile" },
]}
button={{
text: "Join Battle",
href: "/",
}}
navItems={navItems}
button={{ text: "Join Battle", href: "/" }}
/>
</div>
{/* Tournament Features Section */}
<div id="tournament-features" data-section="tournament-features">
<FeatureCardNineteen
title="Weekly Tournaments"
description="Compete in high-stakes bracketed tournaments for massive coin rewards and prestigious badges"
tag="Competition"
tagIcon={Trophy}
features={[
{
id: 1,
tag: "Sunday Showdown",
title: "Weekly Tournament",
subtitle: "Every Sunday at 8 PM UTC",
description:
"Join our signature weekly tournament. 10 coins entry fee. Single-elimination bracket format. All skill categories welcome. Winners receive 100 coins plus Champion badge. Runner-up receives 50 coins and finalist badge.",
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-father-s-day-badges-set_23-2148513184.jpg?_wi=2",
imageAlt: "Tournament Championship Badge",
},
{
id: 2,
tag: "Monthly Mega",
title: "Monthly Championship",
subtitle: "First Sunday of each month",
description:
"Our most prestigious tournament. 25 coins entry. Double-elimination format ensures fairness. 500 coin prize pool. Top 3 finalists receive exclusive badges and featured profile placement for the entire month.",
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-father-s-day-badges-set_23-2148513184.jpg?_wi=3",
imageAlt: "Monthly Championship Trophy",
},
{
id: 3,
tag: "Seasonal Elite",
title: "Seasonal Elite Cup",
subtitle: "Quarterly championship tournament",
description:
"The ultimate competitive challenge. 50 coins entry. Multi-round tournament spanning one week. 2000 coin total prize pool. Winners gain Elite status for entire season with special perks and recognition throughout the platform.",
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-father-s-day-badges-set_23-2148513184.jpg?_wi=4",
imageAlt: "Elite Tournament Cup",
},
]}
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
{/* Tournament Pricing/Plans Section */}
<div id="tournament-plans" data-section="tournament-plans">
<PricingCardOne
title="Tournament Entry Packages"
description="Choose your tournament tier and start competing for glory and rewards"
tag="Tournament"
tagIcon={Zap}
title="Weekly Tournament Formats"
description="Join epic weekly tournaments with escalating rewards and exclusive badges"
tag="Competitive Events"
tagIcon={Trophy}
plans={[
{
id: "1",
badge: "Casual",
badgeIcon: "Zap",
price: "10 Coins",
subtitle: "Weekly tournaments",
features: [
"Entry to Sunday Showdown",
"Single-elimination bracket",
"100 coins winner prize",
"Standard badge rewards",
"Public leaderboard ranking",
],
id: "1", badge: "Bronze Bracket", badgeIcon: Zap,
price: "5 Coins", subtitle: "Beginners welcome", features: [
"Best of 3 matches", "50 Coin prize pool", "Rookie badge eligible", "Community voting"],
},
{
id: "2",
badge: "Competitor",
badgeIcon: "Star",
price: "25 Coins",
subtitle: "Monthly championship",
features: [
"Entry to Monthly Championship",
"Double-elimination format",
"500 coins prize pool",
"Featured profile placement",
"Exclusive competitor badge",
"Priority tournament slots",
],
id: "2", badge: "Silver Bracket", badgeIcon: Zap,
price: "10 Coins", subtitle: "Intermediate competitors", features: [
"Best of 5 matches", "100 Coin prize pool", "Pro badge eligible", "Expert voting", "Live commentary"],
},
{
id: "3",
badge: "Elite",
badgeIcon: "Crown",
price: "50 Coins",
subtitle: "Seasonal elite cup",
features: [
"Entry to Seasonal Elite Cup",
"Multi-round format",
"2000 coins prize pool",
"Elite season status",
"Gold championship badge",
"Priority matching system",
"Exclusive elite tournaments",
],
id: "3", badge: "Gold Bracket", badgeIcon: Trophy,
price: "20 Coins", subtitle: "Expert champions only", features: [
"Best of 7 matches", "250 Coin prize pool", "Champion badge eligible", "Premium voting panel", "Exclusive rewards", "Hall of fame"],
},
{
id: "4", badge: "Elite Championship", badgeIcon: Flame,
price: "50 Coins", subtitle: "Legendary competitors", features: [
"Tournament series", "1000 Coin prize pool", "Legend badge", "VIP voting panel", "Sponsorship opportunities", "Media coverage"],
},
]}
animationType="slide-up"
@@ -145,127 +94,11 @@ export default function TournamentsPage() {
/>
</div>
{/* Tournament FAQ Section */}
<div id="tournament-faq" data-section="tournament-faq">
<FaqDouble
title="Tournament FAQ"
description="Learn everything about competing in our tournaments and claiming prizes"
tag="Help Center"
tagIcon={HelpCircle}
faqs={[
{
id: "1",
title: "How do I register for a tournament?",
content:
"Navigate to the Tournaments page and select your desired tournament tier. Click 'Enter Tournament' and confirm the coin entry fee. You'll be automatically placed in the bracket once registrations close. Registrations open 7 days before each tournament and close 1 hour before start time.",
},
{
id: "2",
title: "What is the bracket format?",
content:
"Sunday Showdown uses single-elimination: lose once and you're out. Monthly Championship uses double-elimination: you get a second chance after your first loss. Seasonal Elite Cup uses a custom multi-round format where top performers advance through qualifying rounds.",
},
{
id: "3",
title: "How are matchups determined?",
content:
"Tournament matchups are determined by seeding based on recent performance metrics and skill ratings. Top-seeded players face lower seeds. Matchups are announced 24 hours before tournament start. Premium members get priority seeding advantages.",
},
{
id: "4",
title: "What happens if I miss my match?",
content:
"If you miss your scheduled match within the grace period (15 minutes), you'll receive an automatic loss. After 2 no-shows in a season, you'll be temporarily barred from tournament participation. Make sure to check your schedule and join matches on time.",
},
{
id: "5",
title: "Can I withdraw from a tournament?",
content:
"You can withdraw up to 12 hours before your match. Withdrawal within 12 hours of match start results in match loss. Entry fees are not refunded for withdrawals. Elite status members can request one free withdrawal per season.",
},
{
id: "6",
title: "How are winners determined?",
content:
"Tournament winners are determined by bracket advancement. Final matches determine overall champion. Ties are broken by voting score in the final battle. All battles within tournaments follow standard voting and coin reward rules.",
},
{
id: "7",
title: "When do I receive my prize coins?",
content:
"Prize coins are automatically awarded to winners' accounts immediately when the tournament concludes. Badges are displayed on your profile and leaderboard position updates in real-time. You can use your prize coins instantly for new battles.",
},
{
id: "8",
title: "Are there team tournaments?",
content:
"Currently all tournaments are individual competitions. Team tournaments are on our roadmap for Q2. Team tournaments will feature 2v2 and 3v3 formats with shared coin pools and team leaderboard rankings coming soon.",
},
]}
faqsAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
{/* Footer */}
<div id="footer" data-section="footer">
<FooterBase
logoText="SkillFight Arena"
copyrightText="© 2025 SkillFight Arena | Battle. Vote. Win."
columns={[
{
title: "Battle",
items: [
{
label: "Create Challenge",
href: "create-challenge",
},
{
label: "Active Battles",
href: "/",
},
{
label: "Tournament",
href: "/tournaments",
},
],
},
{
title: "Account",
items: [
{
label: "My Profile",
href: "profile",
},
{
label: "Leaderboard",
href: "/leaderboard",
},
{
label: "Purchase Coins",
href: "pricing",
},
],
},
{
title: "Support",
items: [
{
label: "Help Center",
href: "#faq",
},
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
columns={footerColumns}
/>
</div>
</ThemeProvider>

View File

@@ -1,51 +1,49 @@
"use client";
import React, { SVGProps } from 'react';
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
className?: string;
interface SvgTextLogoProps extends SVGProps<SVGSVGElement> {
text?: string;
fontSize?: number;
fontFamily?: string;
fill?: string;
strokeWidth?: number;
stroke?: string;
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text = 'Logo',
fontSize = 48,
fontFamily = 'Arial, sans-serif',
fill = '#000000',
strokeWidth = 0,
stroke = 'none',
...props
}) => {
const textLength = text.length;
const charWidth = fontSize * 0.6;
const viewBoxWidth = textLength * charWidth + 20;
const viewBoxHeight = fontSize + 20;
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
viewBox={`0 0 ${viewBoxWidth} ${viewBoxHeight}`}
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<text
ref={textRef}
x="0"
y={verticalAlign === "center" ? "50%" : "0"}
className="font-bold fill-current"
style={{
fontSize: "20px",
letterSpacing: "-0.02em",
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
}}
x="10"
y="50%"
fontSize={fontSize}
fontFamily={fontFamily}
fill={fill}
stroke={stroke}
strokeWidth={strokeWidth}
dominantBaseline="middle"
textAnchor="start"
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;