- Backend: Voice-Stats (Ping, Gateway, Status, Uptime) via SSE alle 5s
- Frontend: Klick auf Verbunden oeffnet Modal mit allen Verbindungsdetails
- Ping-Anzeige direkt im Header neben Verbunden
- Farbcodierte Ping-Dots (gruen <80ms, gelb <150ms, rot >=150ms)
- Uptime-Zaehler seit letztem VoiceConnection Ready
- connectedSince Tracking pro Guild
Backend:
- nowPlaying Map trackt aktuell gespielten Sound pro Guild
- SSE broadcast { type: 'nowplaying' } bei play und stop
- nowplaying im SSE-Snapshot für neue Clients
- playFilePath Helper broadcastet ebenfalls (Party Mode)
Frontend:
- SSE-Handler für nowplaying Events (sync über alle Clients)
- Now-Playing als Pill-Badge in der Topbar (rechts, neben Channel)
- Bottombar komplett entfernt
- Fade-in Animation und accent-farbige Pill
- --accent-rgb CSS Variable für alle Themes
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Volume-Control von Bottom-Bar in Toolbar verschoben (links von Random)
- Pill-förmiges Design passend zu Size-Slider
- "Spielt" Anzeige bleibt bis Stop oder neuer Sound sichtbar
- Anfangsbuchstaben nur beim ersten Sound jeder Gruppe
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Complete rewrite of App.tsx and styles.css to match the Discord-style
soundboard mockup design:
- Topbar: logo, custom channel dropdown, centered live clock, connection status
- Toolbar: category tabs (Alle/Neu/Favoriten), search, Random/Party/Stop
buttons, card size slider, theme color dots (5 themes)
- Main: responsive square card grid with initial letter avatars, ripple
effects, playing animations, favorite stars, NEW badges
- Bottom bar: now-playing wave indicator, volume slider
- Context menu on right-click (play, favorite, admin delete)
- Party mode overlay, toast notifications, admin panel
- All API integration preserved (SSE, channels, volume, play, party)
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Adds a size selector in the header bar that allows users to choose
between Small, Medium, and Large sound buttons. Choice persists
via localStorage. Responsive breakpoints also respect the setting.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Redesigned the entire frontend with a new "DECK" aesthetic:
- 5 distinctive themes: Midnight, Daylight, Neon, Vapor, Matrix
- Compact pill-shaped sound buttons with category color bars
- Tab navigation: All Sounds / Favorites / Recently Added
- Horizontal category filter chips with color coding
- Fixed bottom control bar: Stop, Random, Party, Volume
- Responsive layout optimized for 800+ sounds
- Syne + Outfit typography pairing
- Party mode with animated gradient effects
- Search with clear button, "Now Playing" indicator
- Admin panel as modal overlay
- Subtle dot grid background pattern on dark themes
Replaces the previous Apple Music-style card layout with a dense,
efficient grid that scales properly for large sound libraries.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
