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

Merge branch 'track-card-plain-shell' into dev

Browse Source
This commit is contained in:
daniel-c-harvey
2026-06-05 16:26:20 -04:00
parent eed99df0dd 61c5bee5d7
commit 3c17260f32
2 changed files with 10 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
DeepDrftPublic/wwwroot/styles/deepdrft-styles.css
+5 -5
View File
@@ -211,7 +211,7 @@ body, p, span, div,
8. TRACK CARDS 8. TRACK CARDS
============================================================================= */ ============================================================================= */
/* Container — always transparent so MudCard's paper background never competes /* Container — transparent so no background competes
with the absolute-positioned fallback panel or album art. */ with the absolute-positioned fallback panel or album art. */
.deepdrft-track-card-container { .deepdrft-track-card-container {
width: 250px; width: 250px;
@@ -219,7 +219,7 @@ body, p, span, div,
min-width: 250px; min-width: 250px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
background: transparent !important; background: transparent;
} }
/* Dark: glass edge to match NowPlayingCard vocabulary */ /* Dark: glass edge to match NowPlayingCard vocabulary */
@@ -265,19 +265,19 @@ body, p, span, div,
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: var(--deepdrft-navy-mid, #162437) !important; background: var(--deepdrft-navy-mid, #162437);
} }
/* Fallback panel — navy-glass, dark theme. Mirrors NowPlayingCard's .now-playing glass. */ /* Fallback panel — navy-glass, dark theme. Mirrors NowPlayingCard's .now-playing glass. */
.deepdrft-theme-dark .deepdrft-track-card-fallback { .deepdrft-theme-dark .deepdrft-track-card-fallback {
background: color-mix(in srgb, var(--deepdrft-navy) 55%, transparent) !important; background: color-mix(in srgb, var(--deepdrft-navy) 55%, transparent);
border: 1px solid rgba(250, 250, 248, 0.12); border: 1px solid rgba(250, 250, 248, 0.12);
backdrop-filter: blur(8px); backdrop-filter: blur(8px);
} }
/* Fallback panel — light theme: subtle navy tint on off-white */ /* Fallback panel — light theme: subtle navy tint on off-white */
.deepdrft-theme-light .deepdrft-track-card-fallback { .deepdrft-theme-light .deepdrft-track-card-fallback {
background: color-mix(in srgb, var(--deepdrft-navy) 8%, var(--deepdrft-white)) !important; background: color-mix(in srgb, var(--deepdrft-navy) 8%, var(--deepdrft-white));
border: 1px solid var(--deepdrft-border); border: 1px solid var(--deepdrft-border);
} }
DeepDrftShared.Client/Components/TrackCard.razor
+5 -8
View File
@@ -1,5 +1,4 @@
<MudCard Class="deepdrft-track-card-container" <div class="deepdrft-track-card-container">
Elevation="0">
@if (!string.IsNullOrEmpty(TrackModel?.ImagePath)) @if (!string.IsNullOrEmpty(TrackModel?.ImagePath))
{ {
@@ -8,12 +7,10 @@
} }
else else
{ {
<MudPaper Class="deepdrft-track-card-fallback" <div class="deepdrft-track-card-fallback"></div>
Elevation="0">
</MudPaper>
} }
<MudCardContent Class="deepdrft-track-card-content"> <div class="deepdrft-track-card-content">
<div class="deepdrft-track-info-top"> <div class="deepdrft-track-info-top">
<MudText Typo="Typo.subtitle1" <MudText Typo="Typo.subtitle1"
@@ -67,6 +64,6 @@
OnClick="@PlayClick"/> OnClick="@PlayClick"/>
</div> </div>
</MudCardContent> </div>
</MudCard> </div>