From 4b5de088ab46eb18469dbf159e296a9590df375b Mon Sep 17 00:00:00 2001 From: daniel-c-harvey Date: Sat, 6 Jun 2026 20:33:21 -0400 Subject: [PATCH] fix: correct MudBlazor Tertiary class targets and demote artist to muted off-white in TrackCard --- .../Components/TrackCard.razor.css | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/DeepDrftShared.Client/Components/TrackCard.razor.css b/DeepDrftShared.Client/Components/TrackCard.razor.css index 6e002a6..05845b7 100644 --- a/DeepDrftShared.Client/Components/TrackCard.razor.css +++ b/DeepDrftShared.Client/Components/TrackCard.razor.css @@ -49,16 +49,16 @@ won't stamp b-{hash} on it; ::deep pierces into child component output. */ ::deep .deepdrft-track-title { color: var(--deepdrft-white, #FAFAF8); } -/* Artist: green-accent — matches .np-label. ::deep for same reason. */ -::deep .deepdrft-track-artist { color: var(--deepdrft-green-accent, #3D7A68); } +/* Artist: muted off-white — green reserved for interactive elements (FAB, chip). ::deep for same reason. */ +::deep .deepdrft-track-artist { color: rgba(250, 250, 248, 0.55); } /* Meta: muted off-white — matches .np-sub. ::deep for same reason. */ ::deep .deepdrft-track-meta { color: rgba(250, 250, 248, 0.45); } -/* FAB always green-accent — card is always dark glass regardless of page theme. - .mud-button-filled-primary specificity (0,1,0) in MudBlazor; our (0,1,1) wins. */ -::deep .mud-button-filled-primary { - background-color: var(--deepdrft-green-accent, #3D7A68); +/* FAB always green-interactive — card is always dark glass regardless of page theme. + .mud-button-filled-tertiary specificity (0,1,0) in MudBlazor; our (0,1,1) wins. */ +::deep .mud-button-filled-tertiary { + background-color: var(--deepdrft-green-interactive, #3aa163); color: var(--deepdrft-white, #FAFAF8); } @@ -67,7 +67,7 @@ border-color: var(--deepdrft-green-accent, #3D7A68); color: var(--deepdrft-green-accent, #3D7A68); } -::deep .deepdrft-genre-chip.mud-chip-color-primary { +::deep .deepdrft-genre-chip.mud-chip-color-tertiary { color: var(--deepdrft-green-accent, #3D7A68); }