|
|
153c0e9f13
|
feat: implement CS2-inspired design system and UI components
This commit delivers a comprehensive design system and component library
inspired by Counter-Strike 2's tactical aesthetic.
Design System:
- Created docs/DESIGN.md with complete design language documentation
- CS2-inspired color palette: T-side orange (#d4a74a), CT-side blue (#5e98d9)
- Dark-first approach with tactical, data-dense layouts
- Typography scale, spacing system, and animation guidelines
Component Library:
- Button component: 4 variants (primary, secondary, ghost, danger), 3 sizes
- Badge component: 7 variants including team-specific badges
- Card component: 3 variants (default, elevated, interactive)
- Header component: Responsive navigation with mobile menu
- Footer component: Site-wide footer with organized link sections
Pages:
- Redesigned homepage with hero section, featured matches, features grid, CTA
- Created placeholder pages: /matches, /players, /about
- All pages follow CS2 aesthetic with proper component usage
Technical Fixes:
- Fixed Svelte 5 snippet syntax errors (removed incorrect render prop pattern)
- Fixed Card component accessibility (conditional button/div rendering)
- Removed invalid CSS border-border class from app.css
- Ensured zero TypeScript errors and warnings
Build Status: ✓ Verified with 0 errors, 0 warnings
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-11-04 20:07:05 +01:00 |
|
