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

fix: Waveform Visualizer Controls layout

Browse Source
This commit is contained in:
daniel-c-harvey
2026-06-20 18:56:53 -04:00
parent 5058c72375
commit d3f89c494a
2 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
DeepDrftPublic.Client/Controls/WaveformVisualizerControls.razor
+7 -7
View File
@@ -36,13 +36,13 @@
{
<MudGrid>
@* ── Row 1 — MODE (always visible). ── *@
<MudItem xs="3" Class="d-flex align-center">
<MudItem xs="2" Class="d-flex align-center">
<MudStack Row AlignItems="AlignItems.Center" Justify="Justify.FlexStart">
<span class="wvc-section-label">MODE:</span>
</MudStack>
</MudItem>
<MudItem xs="9">
<MudItem xs="10">
<MudStack Row AlignItems="AlignItems.Center" Justify="Justify.Center" Class="mx-auto" Spacing="4">
<MudTooltip Text="Show the sound, or hide the ribbon.">
<div class="wvc-toggle @(ControlState.WaveformEnabled ? "wvc-toggle-on" : "wvc-toggle-off")" role="group" aria-label="Waveform ribbon on or off">
@@ -102,13 +102,13 @@
@* ── Row 2 — WAVE section (only when waveform on). ── *@
@if (ControlState.WaveformEnabled)
{
<MudItem xs="3" Class="d-flex align-center">
<MudItem xs="2" Class="d-flex align-center">
<MudStack Row AlignItems="AlignItems.Center" Justify="Justify.FlexStart">
<span class="wvc-section-label">WAVE:</span>
</MudStack>
</MudItem>
<MudItem xs="9">
<MudItem xs="10">
<MudStack Row AlignItems="AlignItems.Center" Justify="Justify.Center" Class="mx-auto" Spacing="4">
<MudTooltip Text="How fast the sound rolls by.">
<div class="waveform-visualizer-control mix-visualizer-control" role="group" aria-label="Waveform scroll speed">
@@ -137,13 +137,13 @@
@if (ControlState.LavaEnabled)
{
<MudItem xs="3" Class="d-flex align-center">
<MudItem xs="2" Class="d-flex align-center">
<MudStack Row AlignItems="AlignItems.Center" Justify="Justify.FlexStart">
<span class="wvc-section-label">LAVA:</span>
</MudStack>
</MudItem>
<MudItem xs="9" Class="d-flex align-center">
<MudItem xs="10" Class="d-flex align-center">
<MudStack Row AlignItems="AlignItems.Center" Justify="Justify.Center" Class="mx-auto" Spacing="4">
<MudTooltip Text="How heavy the wax feels — float, or sink.">
<div class="waveform-visualizer-control mix-visualizer-control" role="group" aria-label="Lava gravity">
@@ -167,7 +167,7 @@
</div>
</MudTooltip>
<MudTooltip Text="How much goo is in the lamp.">
<MudTooltip Text="How much wax is in the lamp.">
<div class="waveform-visualizer-control mix-visualizer-control" role="group" aria-label="Fluid amount">
<RadialKnob Value="@ControlState.FluidAmount"
ValueChanged="@OnFluidAmountChanged"
DeepDrftPublic/wwwroot/styles/deepdrft-styles.css
+1 -1
View File
@@ -440,7 +440,7 @@ h2, h3, h4, h5, h6,
flex-direction: column;
gap: 0.75rem;
min-height: 0;
max-width: 420px;
max-width: 480px;
/* Pin the MudBlazor palette vars the portaled RadialKnob + slider consume. */
--mud-palette-primary: var(--deepdrft-green-accent); /* knob arc/pointer + slider track/thumb (interactive) */
--mud-palette-surface: var(--deepdrft-navy); /* knob center fill — darkest navy reads against the panel */