ranger/rangerhq-radio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(0.3.1): My Radio layout polish + drop dark-auto

Browse Source 
Real-screen review of v0.3.0 surfaced a contrast bug and several layout
issues. Quick patch.

- Drop @media prefers-color-scheme dark for theme=auto. WP admin has
  no native dark mode, so OS-dark made our light text sit on the still-
  white WP postbox = unreadable. `auto` now behaves as light; `dark`
  remains as an explicit choice.
- theme=dark now actually reads: the player surface itself goes dark
  (#1d2327 bg + subtle border + padding) so the light text has somewhere
  to land instead of fighting the white WP postbox.
- .radio-wrap max-width 880px — player no longer stretches edge-to-edge.
- Drop the .radio-intro max-width:720px cap so the intro fits one line.
- Volume slider fixed at flex:0 0 auto / width:220px — % label sits next
  to the slider instead of pinned to the far edge.
- Station dropdown capped at 360px (was width:100%).
- Play-button dashicon shrunk 18px → 14px so it sits on the button-text
  baseline instead of looking like a second row.

Files: radio.php, assets/css/radio.css, inc/about.php, CHANGELOG.md.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
David Keane
2026-05-29 23:11:06 +01:00
parent c5a4b28b29
commit 774e7f9958
4 changed files with 46 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CHANGELOG.md
+17
View File
@@ -9,6 +9,23 @@ Format: [Keep a Changelog 1.1.0](https://keepachangelog.com/en/1.1.0/) — versi
---
## [0.3.1] — 2026-05-29 — My Radio layout polish + drop dark-auto
Quick patch after a real-screen review of the My Radio admin page. v0.3.0 added a lot of features but stretched the player to fill the full admin width and — embarrassingly — introduced a real contrast bug via the dark-auto CSS.
### Fixed
- **Dropped `@media (prefers-color-scheme: dark)` for `theme=auto`.** WordPress admin has no native dark mode, so when the OS was dark, our dark text rendered on the still-white WP postbox = unreadable. `auto` now behaves as light (matching WP's actual scheme); `dark` is still available as an explicit choice.
- **`theme=dark` now actually reads.** The player surface goes dark (`#1d2327` background + subtle border + padding) so the light text has somewhere to sit, instead of fighting the white WP postbox.
- **Player no longer stretches edge-to-edge.** `.radio-wrap { max-width: 880px; }` keeps the player a focused settings-page card.
- **Intro paragraph one-line on normal widths.** Removed the `max-width: 720px` cap that was forcing the wrap.
- **Volume slider no longer dominates the row.** Fixed width 220px (`flex: 0 0 auto`) — the percent label now sits next to the slider instead of pinned to the far right edge.
- **Station dropdown** capped at 360px (was full-width) — typical WP form-control width.
- **Play button icon** shrunk from 18px to 14px so the ▶ glyph sits on the button-text baseline instead of looking like a separate row.
**Files changed:** `radio.php` (version), `assets/css/radio.css` (wrap width, intro, play icon, volume, station-select, dark-auto block deleted, dark-surface added), `inc/about.php` (history entry).
---
## [0.3.0] — 2026-05-29 — Dark theme + mute + media keys + current-track display
A polish pass that closes the gaps surfaced by a UI review. Two categories: **2nd-look fixes** (things the previous release implied but didn't actually deliver) and **nice-to-haves** (small upgrades that lift the admin-player feel).