Overview
Modern gaming expo website featuring custom Tailwind theme, responsive layouts, interactive countdown timer, and embedded game integration with real-time leaderboard visualization.
Technologies
Tailwind CSS 4
Blade Templates
Vite
Vanilla JavaScript
Swiper.js
AxiosKey Features
Custom Tailwind design system with brand tokens
Responsive navbar with mobile hamburger menu
Real-time countdown timer with vanilla JS
Fullscreen iframe game integration with device detection
Dynamic leaderboard table with gradient styling
SEO-optimized meta tags and Open Graph
Technical Challenges
Custom Tailwind 4 Theme Architecture
Built production-grade design system using CSS variables in @theme layer, ensuring consistent brand colors and typography across all components.
Cross-Device Game Iframe Handling
Implemented device detection with fullscreen API fallbacks, dynamically serving mobile/desktop game versions with ESC-key and browser fullscreen event listeners.
Responsive Wave Background Pattern
Created adaptive SVG wave separator using CSS pseudo-elements with breakpoint-specific height adjustments (10rem to 30rem) for seamless section transitions.