Redesign the listener-facing UI: design system, Now Playing deck overhaul #1

Merged

cherry merged 1 commit from claude/tidal-radio-ui-setup-11d13b into main

2026-10-15 19:42:16 +11:00

elphiene commented

2026-10-15 19:41:39 +11:00

Collaborator

Reworks the Now Playing deck specifically: a full-width VU meter whose bar
count scales with viewport (thin bars at every size, not a fixed few
stretching wide), icon-only mute/full-screen controls, a two-beat CRT
power-on reveal (backdrop fade then sweep, both quick), and a full-screen
layout where the album art grows to fill most of the screen with details and
controls pinned below it. The listen page now dedicates ~90% of the initial
viewport to the player, with the upcoming-tracks queue peeking in below.

Carries the backend/infra support this needed: Icecast CORS headers (the VU
meter's AnalyserNode needs non-tainted cross-origin audio), a polled
listener-count surfaced through NowPlayingView, and a docker-compose preview
stack + vite preview config for checking a UI branch live before merging.

See UI_DESIGN.md for the design system's conventions and the player's
deliberate animation/layout decisions.

Introduces a shared design-system layer (BaseButton, ToggleSwitch, SegmentedControl, Badge, ActionMenu, ConfirmDialog/useConfirm) and applies it consistently across every view, admin screens included. Reworks the Now Playing deck specifically: a full-width VU meter whose bar count scales with viewport (thin bars at every size, not a fixed few stretching wide), icon-only mute/full-screen controls, a two-beat CRT power-on reveal (backdrop fade then sweep, both quick), and a full-screen layout where the album art grows to fill most of the screen with details and controls pinned below it. The listen page now dedicates ~90% of the initial viewport to the player, with the upcoming-tracks queue peeking in below. Carries the backend/infra support this needed: Icecast CORS headers (the VU meter's AnalyserNode needs non-tainted cross-origin audio), a polled listener-count surfaced through NowPlayingView, and a docker-compose preview stack + vite preview config for checking a UI branch live before merging. See UI_DESIGN.md for the design system's conventions and the player's deliberate animation/layout decisions.

elphiene added 1 commit

2026-10-15 19:41:39 +11:00

Redesign the listener-facing UI: design system, Now Playing deck overhaul 2a9b841c13

Introduces a shared design-system layer (BaseButton, ToggleSwitch,
SegmentedControl, Badge, ActionMenu, ConfirmDialog/useConfirm) and applies it
consistently across every view, admin screens included.

Reworks the Now Playing deck specifically: a full-width VU meter whose bar
count scales with viewport (thin bars at every size, not a fixed few
stretching wide), icon-only mute/full-screen controls, a two-beat CRT
power-on reveal (backdrop fade then sweep, both quick), and a full-screen
layout where the album art grows to fill most of the screen with details and
controls pinned below it. The listen page now dedicates ~90% of the initial
viewport to the player, with the upcoming-tracks queue peeking in below.

Carries the backend/infra support this needed: Icecast CORS headers (the VU
meter's AnalyserNode needs non-tainted cross-origin audio), a polled
listener-count surfaced through NowPlayingView, and a docker-compose preview
stack + vite preview config for checking a UI branch live before merging.

See UI_DESIGN.md for the design system's conventions and the player's
deliberate animation/layout decisions.