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

fix: LevelMeterFab icon tint via inline style, bypass Blazor CSS isolation scoping of :root

Browse Source
This commit is contained in:
daniel-c-harvey
2026-06-08 08:25:56 -04:00
parent b88af29731
commit 1c942ffb2b
3 changed files with 12 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
DeepDrftPublic.Client/Controls/AudioPlayerBar/LevelMeterFab.razor.css
+1 -13
View File
@@ -1,10 +1,3 @@
/* Band color variables — tune here, applied everywhere below */
:root {
--lmf-green: #2ECC71;
--lmf-yellow: #F4C430;
--lmf-orange: #FF6B35;
}
/* Circular FAB matching MudFab Size.Large (56px) with MudBlazor primary palette */
.lmf-fab-btn {
width: 56px;
@@ -35,14 +28,9 @@
outline-offset: 3px;
}
/* The icon SVG — transitions on both color and glow */
/* Transition fires when _svgStyle changes between band states */
.lmf-icon {
width: 24px;
height: 24px;
transition: color 120ms ease-out, filter 120ms ease-out;
}
/* Band tints — applied directly to the SVG via fill="currentColor" */
.lmf-green .lmf-icon { color: var(--lmf-green); filter: drop-shadow(0 0 6px rgba(46, 204, 113, 0.45)); }
.lmf-yellow .lmf-icon { color: var(--lmf-yellow); filter: drop-shadow(0 0 6px rgba(244, 196, 48, 0.45)); }
.lmf-orange .lmf-icon { color: var(--lmf-orange); filter: drop-shadow(0 0 6px rgba(255, 107, 53, 0.45)); }