diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx new file mode 100644 index 0000000..d246b4e --- /dev/null +++ b/src/app/admin/page.tsx @@ -0,0 +1,199 @@ +"use client"; + +import { BarChart3, Settings, Trophy, Users, Zap } from "lucide-react"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import HeroLogoBillboard from "@/components/sections/hero/HeroLogoBillboard"; +import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve"; +import MetricCardTen from "@/components/sections/metrics/MetricCardTen"; +import FooterBase from "@/components/sections/footer/FooterBase"; +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; + +export default function AdminPage() { + return ( + + + +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + + + ); +} diff --git a/src/app/page.tsx b/src/app/page.tsx index 296d8c6..5ad6c22 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -35,6 +35,7 @@ export default function LandingPage() { { name: "Competitive", id: "competitive" }, { name: "Community", id: "testimonials" }, { name: "FAQ", id: "faq" }, + { name: "Admin", id: "/admin" }, ]} /> diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css index 3d0e32c..dd1fcf4 100644 --- a/src/app/styles/variables.css +++ b/src/app/styles/variables.css @@ -10,15 +10,15 @@ --accent: #ffffff; --background-accent: #ffffff; */ - --background: #ffffff; - --card: #f9f9f9; - --foreground: #000f06e6; - --primary-cta: #0a7039; + --background: #0a0a0a; + --card: #1a1a1a; + --foreground: #ffffff; + --primary-cta: #00d9ff; --primary-cta-text: #ffffff; - --secondary-cta: #f9f9f9; + --secondary-cta: #ff6b1a; --secondary-cta-text: #000f06e6; - --accent: #e2e2e2; - --background-accent: #c4c4c4; + --accent: #00d9ff; + --background-accent: #ff6b1a; /* text sizing - set by ThemeProvider */ /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); diff --git a/src/app/teams/page.tsx b/src/app/teams/page.tsx new file mode 100644 index 0000000..ace7e28 --- /dev/null +++ b/src/app/teams/page.tsx @@ -0,0 +1,375 @@ +"use client"; + +import { useState } from "react"; +import { Users, MapPin, Trophy, Users2, Mail, Phone } from "lucide-react"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import TeamCardTen from "@/components/sections/team/TeamCardTen"; +import ContactFaq from "@/components/sections/contact/ContactFaq"; +import FooterBase from "@/components/sections/footer/FooterBase"; +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; + +export default function TeamsPage() { + const [formData, setFormData] = useState({ + teamName: "", captain: "", email: "", phone: "", region: "", skillLevel: ""}); + const [formErrors, setFormErrors] = useState>({}); + const [submitStatus, setSubmitStatus] = useState<"idle" | "success" | "error">("idle"); + + const validateForm = () => { + const errors: Record = {}; + + if (!formData.teamName.trim()) { + errors.teamName = "Team name is required"; + } + if (!formData.captain.trim()) { + errors.captain = "Captain name is required"; + } + if (!formData.email.trim()) { + errors.email = "Email is required"; + } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) { + errors.email = "Please enter a valid email"; + } + if (!formData.phone.trim()) { + errors.phone = "Phone number is required"; + } + if (!formData.region) { + errors.region = "Region is required"; + } + if (!formData.skillLevel) { + errors.skillLevel = "Skill level is required"; + } + + setFormErrors(errors); + return Object.keys(errors).length === 0; + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + + if (!validateForm()) { + setSubmitStatus("error"); + return; + } + + console.log("Form submitted:", formData); + setSubmitStatus("success"); + setFormData({ + teamName: "", captain: "", email: "", phone: "", region: "", skillLevel: ""}); + + setTimeout(() => { + setSubmitStatus("idle"); + }, 3000); + }; + + const handleInputChange = ( + e: React.ChangeEvent + ) => { + const { name, value } = e.target; + setFormData((prev) => ({ + ...prev, + [name]: value, + })); + if (formErrors[name]) { + setFormErrors((prev) => { + const updated = { ...prev }; + delete updated[name]; + return updated; + }); + } + }; + + return ( + + + + + +
+
+
+

Register Your Team

+

+ Join the competitive Counter-Strike community. Register your team to participate in tournaments and events. +

+
+ +
+ {submitStatus === "success" && ( +
+ ✓ Team registration submitted successfully! +
+ )} + + {submitStatus === "error" && Object.keys(formErrors).length > 0 && ( +
+ Please fix the errors below. +
+ )} + +
+
+ + + {formErrors.teamName && ( +

{formErrors.teamName}

+ )} +
+ +
+ + + {formErrors.captain && ( +

{formErrors.captain}

+ )} +
+ +
+ + + {formErrors.email && ( +

{formErrors.email}

+ )} +
+ +
+ + + {formErrors.phone && ( +

{formErrors.phone}

+ )} +
+ +
+ + + {formErrors.region && ( +

{formErrors.region}

+ )} +
+ +
+ + + {formErrors.skillLevel && ( +

{formErrors.skillLevel}

+ )} +
+
+ + +
+
+
+ +
+ +
+ + + + ); +} diff --git a/src/app/tickets/page.tsx b/src/app/tickets/page.tsx new file mode 100644 index 0000000..75840ba --- /dev/null +++ b/src/app/tickets/page.tsx @@ -0,0 +1,252 @@ +"use client"; + +import { ShoppingCart, Ticket, ArrowRight, Check } from "lucide-react"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import ContactCTA from "@/components/sections/contact/ContactCTA"; +import FooterBase from "@/components/sections/footer/FooterBase"; +import PricingCardFive from "@/components/sections/pricing/PricingCardFive"; +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import { useState } from "react"; + +export default function TicketsPage() { + const [cart, setCart] = useState>([]); + const [selectedPlan, setSelectedPlan] = useState(null); + + const addToCart = (planId: string, planName: string, price: number) => { + const existingItem = cart.find((item) => item.id === planId); + if (existingItem) { + setCart( + cart.map((item) => + item.id === planId ? { ...item, quantity: item.quantity + 1 } : item + ) + ); + } else { + setCart([...cart, { id: planId, name: planName, price, quantity: 1 }]); + } + setSelectedPlan(planId); + }; + + const removeFromCart = (planId: string) => { + setCart(cart.filter((item) => item.id !== planId)); + }; + + const updateQuantity = (planId: string, quantity: number) => { + if (quantity <= 0) { + removeFromCart(planId); + } else { + setCart( + cart.map((item) => + item.id === planId ? { ...item, quantity } : item + ) + ); + } + }; + + const cartTotal = cart.reduce((sum, item) => sum + item.price * item.quantity, 0); + + const handleCheckout = () => { + if (cart.length === 0) { + alert("Please add tickets to your cart"); + return; + } + alert(`Processing checkout for ${cart.length} ticket(s) - Total: $${cartTotal.toFixed(2)}`); + }; + + return ( + + + +
+
+
+ + Esports Championship +
+

Counter-Strike 2 Championship

+

+ Secure your spot at the biggest esports event of the year. Watch professional teams compete for glory and prize pools. +

+
+
+ +
+ addToCart("general-admission", "General Admission", 49), + }, + featuresTitle: "What's Included:", features: [ + "General venue access", "Standard seating", "Complimentary water and snacks", "Official event merchandise discount"], + }, + { + id: "vip-package", tag: "VIP Package", tagIcon: Check, + price: "$149", period: "/ticket", description: "Premium experience with priority seating and exclusive perks.", button: { + text: "Add to Cart", onClick: () => addToCart("vip-package", "VIP Package", 149), + }, + featuresTitle: "What's Included:", features: [ + "Premium seating (front section)", "Early venue entry", "VIP lounge access", "Exclusive event merchandise", "Meet & greet opportunity", "Premium food and beverages"], + }, + { + id: "pro-pass", tag: "Pro Pass", tagIcon: Check, + price: "$299", period: "/ticket", description: "The ultimate championship experience with full access and exclusives.", button: { + text: "Add to Cart", onClick: () => addToCart("pro-pass", "Pro Pass", 299), + }, + featuresTitle: "What's Included:", features: [ + "VIP ringside seating", "Exclusive afterparty access", "Professional photography package", "Limited edition pro pass merchandise", "Private player autograph session", "Premium dining experience", "Behind-the-scenes tour", "24/7 concierge support"], + }, + ]} + /> +
+ +
+
+
+

+ + Your Cart +

+ + {cart.length === 0 ? ( +

+ Your cart is empty. Select tickets above to get started. +

+ ) : ( +
+
+ {cart.map((item) => ( +
+
+

{item.name}

+

${item.price.toFixed(2)} each

+
+
+
+ + {item.quantity} + +
+

+ ${(item.price * item.quantity).toFixed(2)} +

+ +
+
+ ))} +
+ +
+
+ Total: + ${cartTotal.toFixed(2)} +
+ +
+
+ )} +
+
+
+ +
+ +
+ + + + ); +} diff --git a/src/app/tournament/page.tsx b/src/app/tournament/page.tsx new file mode 100644 index 0000000..30417ed --- /dev/null +++ b/src/app/tournament/page.tsx @@ -0,0 +1,184 @@ +"use client"; + +import { Calendar, MapPin, Trophy, Users, Clock, Award } from "lucide-react"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel"; +import TimelineHorizontalCardStack from "@/components/cardStack/layouts/timelines/TimelineHorizontalCardStack"; +import FaqBase from "@/components/sections/faq/FaqBase"; +import FooterBase from "@/components/sections/footer/FooterBase"; +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; + +export default function TournamentPage() { + return ( + + + +
+ +
+ +
+ +
+

Qualifiers

+

February 1-15, 2025

+

Regional qualifiers for 64 teams

+
+
+

Group Stage

+

February 20 - March 5, 2025

+

32 teams compete in group format

+
+
+

Semifinals

+

March 8-10, 2025

+

Top 4 teams battle for finals spots

+
+
+

Grand Finals

+

March 12-15, 2025

+

Championship match at main venue

+
+ +
+ +
+ +
+ + + + ); +}