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

fix(css): add ::deep prefix to MudBlazor component classes in AudioPlayerBar scoped styles

Browse Source
This commit is contained in:
daniel-c-harvey
2026-06-04 20:04:27 -04:00
parent 73e0eea328
commit f07ab4b235
1 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
DeepDrftPublic.Client/Controls/AudioPlayerBar/AudioPlayerBar.razor.css
+10 -10
View File
@@ -12,13 +12,13 @@
margin: 0; margin: 0;
} }
.player-inner-container { ::deep .player-inner-container {
padding: 1rem; padding: 1rem;
padding-bottom: 1.5rem; padding-bottom: 1.5rem;
} }
/* The visible surface is a MudPaper; scoped CSS only sets geometry + a hairline accent */ /* The visible surface is a MudPaper; scoped CSS only sets geometry + a hairline accent */
.player-surface { ::deep .player-surface {
position: relative; position: relative;
border-radius: 16px; border-radius: 16px;
border: 1px solid var(--mud-palette-primary); border: 1px solid var(--mud-palette-primary);
@@ -27,47 +27,47 @@
} }
/* Minimize / close cluster, pinned top-right of the surface */ /* Minimize / close cluster, pinned top-right of the surface */
.player-surface ::deep .player-window-controls { ::deep .player-surface .player-window-controls {
position: absolute; position: absolute;
top: 0.5rem; top: 0.5rem;
right: 0.5rem; right: 0.5rem;
} }
/* Minimized floating dock — positioning + hover only; colour from MudFab */ /* Minimized floating dock — positioning + hover only; colour from MudFab */
.minimized-dock { ::deep .minimized-dock {
position: fixed; position: fixed;
bottom: 60px; bottom: 60px;
right: 60px; right: 60px;
z-index: 1300; z-index: 1300;
} }
.minimized-dock:hover { ::deep .minimized-dock:hover {
transform: scale(1.1); transform: scale(1.1);
} }
/* Spacer to prevent content overlap */ /* Spacer to prevent content overlap */
.player-spacer { ::deep .player-spacer {
height: 140px; height: 140px;
width: 100%; width: 100%;
flex-shrink: 0; flex-shrink: 0;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.minimized-dock { ::deep .minimized-dock {
bottom: 15px; bottom: 15px;
right: 15px; right: 15px;
} }
.player-inner-container { ::deep .player-inner-container {
padding: 0.75rem; padding: 0.75rem;
padding-bottom: 1.25rem; padding-bottom: 1.25rem;
} }
.player-surface { ::deep .player-surface {
margin-bottom: 1.25rem; margin-bottom: 1.25rem;
} }
.player-spacer { ::deep .player-spacer {
height: 160px; height: 160px;
} }
} }