From 4b5de088ab46eb18469dbf159e296a9590df375b Mon Sep 17 00:00:00 2001 From: daniel-c-harvey Date: Sat, 6 Jun 2026 20:33:21 -0400 Subject: [PATCH 1/2] 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); } From 07ba9946ce266812b31ccf2ee4ae321a140dba82 Mon Sep 17 00:00:00 2001 From: daniel-c-harvey Date: Sat, 6 Jun 2026 20:36:46 -0400 Subject: [PATCH 2/2] feat: add --deepdrft-green-interactive token to design token layer --- DeepDrftShared.Client/wwwroot/styles/deepdrft-tokens.css | 1 + 1 file changed, 1 insertion(+) diff --git a/DeepDrftShared.Client/wwwroot/styles/deepdrft-tokens.css b/DeepDrftShared.Client/wwwroot/styles/deepdrft-tokens.css index feff9fe..7bc46be 100644 --- a/DeepDrftShared.Client/wwwroot/styles/deepdrft-tokens.css +++ b/DeepDrftShared.Client/wwwroot/styles/deepdrft-tokens.css @@ -11,6 +11,7 @@ --deepdrft-green: #1A3C34; --deepdrft-green-light: #2A5C4F; --deepdrft-green-accent: #3D7A68; + --deepdrft-green-interactive: #3aa163; --deepdrft-muted: #8A9BB0; --deepdrft-white: #FAFAF8; --deepdrft-border: rgba(13, 27, 42, 0.10);