daniel/deepdrft
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 13 Wiki Activity

docs: mark track-card glass theming completed

Browse Source
This commit is contained in:
daniel-c-harvey
2026-06-05 15:36:40 -04:00
parent 231ed399a3
commit b9b2c131a8
2 changed files with 358 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
COMPLETED.md
+30
View File
@@ -8,6 +8,36 @@ Newest entries at the top. Group by phase/wave header (mirroring `PLAN.md` / `CM
## Phase 2 — Product surface: player and theming
**Status:** Track card glass theming landed on 2026-06-05. AudioPlayerBar responsive unification and SpectrumVisualizer fix landed on 2026-06-05.
### Track Card Glass Theming
**Landed 2026-06-05.**
Aligned `TrackCard` component visual language with the `NowPlayingCard` aesthetic via glass background + text hierarchy. Two coordinated changes:
**Razor changes (`DeepDrftShared.Client/Components/TrackCard.razor`):**
- Removed `mud-theme-secondary` class and `Color="Color.Surface"` attributes from all four `MudText` elements, handing color control to CSS.
- Added semantic class hooks: `deepdrft-track-title` (track name), `deepdrft-track-artist` (artist), `deepdrft-track-meta` (album and release year).
- Changed MudCard `Elevation="4"` → `Elevation="0"` to align with glass-panel vocabulary (no drop shadow).
**CSS changes (`DeepDrftPublic/wwwroot/styles/deepdrft-styles.css` §8):**
- Dark theme: navy-glass fallback panel (`color-mix(in srgb, var(--deepdrft-navy) 55%, transparent)` + `backdrop-filter: blur(8px)` + translucent border), matching `NowPlayingCard` glass vocabulary.
- Text hierarchy (dark): title in off-white, artist in moss-green accent, meta in muted off-white — mirrors the `NowPlayingCard` hierarchy.
- Content scrim behind text (dark): dark navy gradient to guarantee legibility over both glass fallback and album art.
- Light theme: subtle navy-tint fallback on off-white, light text inherits body colour for legibility.
- Glass border on card container (dark): `1px solid rgba(250, 250, 248, 0.12)` for aesthetic consistency.
**Scope:**
- `TrackCard` component in shared `DeepDrftShared.Client` consumed by both public site and CMS.
- CSS in `DeepDrftPublic/wwwroot/styles/deepdrft-styles.css` (public site only, not loaded by CMS).
- Build clean: 0 errors, 0 new warnings.
**Notes for future work:**
- Genre chip text still uses `Color.Primary` (moss-green); it now sits alongside moss-green artist text. Consider a distinct genre-chip treatment (3a) in future polish work.
---
**Status:** AudioPlayerBar responsive unification and SpectrumVisualizer fix landed on 2026-06-05.
### AudioPlayerBar Responsive Unification