fix(p15): remediate four green-minor review findings
Tokenize scrim navy RGB triple (--deepdrft-scrim-rgb); LAVA row now flex-start so knobs group left; WAVE row keeps space-between for right-pinned width knob; remove inert margin-left:auto/wvc-row-right; correct stale seven->ten count in OnControlStateChanged comment.
This commit is contained in:
@@ -280,10 +280,11 @@ public partial class WaveformVisualizer : ComponentBase, IAsyncDisposable
|
||||
await PushThemeIfChangedAsync();
|
||||
}
|
||||
|
||||
// The controls bar mutated a knob on the shared state and raised Changed. Push all seven control
|
||||
// values (cheap scalar interop). Each control now drives its own dedicated dial in the JS handle
|
||||
// (lava reframe Wave R4) — scroll speed → visible-time-span, plus the six lava/colour dials; see
|
||||
// PushControlsAsync. The bridge stays the sole owner of the JS module handle.
|
||||
// The controls bar mutated a knob on the shared state and raised Changed. Push all ten control
|
||||
// values (cheap scalar interop): the eight continuous dials plus the two subsystem enables. Each
|
||||
// dial drives its own dedicated uniform in the JS handle (lava reframe Wave R4) — scroll speed →
|
||||
// visible-time-span, plus the six lava/colour dials; see PushControlsAsync. The bridge stays the
|
||||
// sole owner of the JS module handle.
|
||||
private void OnControlStateChanged() => InvokeAsync(async () =>
|
||||
{
|
||||
await PushControlsAsync();
|
||||
|
||||
@@ -82,7 +82,7 @@
|
||||
@* Color applies to the whole field regardless of which subsystems are on, so it is pinned
|
||||
far-right of row 1 and never reflows when collisions hides (§3). *@
|
||||
<MudTooltip Text="How fast the lamp drifts through its colors.">
|
||||
<div class="waveform-visualizer-control mix-visualizer-control wvc-row-right" role="group" aria-label="Color gradient rotation speed">
|
||||
<div class="waveform-visualizer-control mix-visualizer-control" role="group" aria-label="Color gradient rotation speed">
|
||||
<RadialKnob Value="@ControlState.GradientRotationSpeed"
|
||||
ValueChanged="@OnGradientRotationSpeedChanged"
|
||||
Min="0" Max="1" Step="0.001"
|
||||
@@ -148,7 +148,7 @@
|
||||
@* ── Row 3 — WAVE section (only when waveform on). Scroll is a SLIDER (§8); width pinned right. ── *@
|
||||
@if (ControlState.WaveformEnabled)
|
||||
{
|
||||
<div class="wvc-row wvc-row-section">
|
||||
<div class="wvc-row wvc-row-section wvc-row-wave">
|
||||
<span class="wvc-section-label">WAVE:</span>
|
||||
|
||||
<MudTooltip Text="How fast the sound rolls by.">
|
||||
@@ -163,7 +163,7 @@
|
||||
</MudTooltip>
|
||||
|
||||
<MudTooltip Text="How wide the ribbon spreads across the lamp.">
|
||||
<div class="waveform-visualizer-control mix-visualizer-control wvc-row-right" role="group" aria-label="Waveform width">
|
||||
<div class="waveform-visualizer-control mix-visualizer-control" role="group" aria-label="Waveform width">
|
||||
<RadialKnob Value="@ControlState.WaveformWidth"
|
||||
ValueChanged="@OnWaveformWidthChanged"
|
||||
Min="0" Max="1" Step="0.001"
|
||||
|
||||
@@ -422,8 +422,9 @@ h2, h3, h4, h5, h6,
|
||||
--mud-palette-text-primary: var(--deepdrft-white); /* knob value label — light */
|
||||
}
|
||||
|
||||
/* ── Row layout (§3). Each row is a horizontal band; row 1 + row 3 space-between so the right-pinned
|
||||
control (color / width) hugs the right edge and never reflows when an inner control hides. ── */
|
||||
/* ── Row layout (§3). Each row is a horizontal band. Row 1 (MODE) and row 3 (WAVE) use
|
||||
space-between so the right-pinned control (color / width) hugs the far edge. Row 2 (LAVA) uses
|
||||
flex-start so its label + four knobs group left rather than spreading edge-to-edge. ── */
|
||||
.waveform-visualizer-control-panel .wvc-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
@@ -431,9 +432,20 @@ h2, h3, h4, h5, h6,
|
||||
gap: 0.85rem 1rem;
|
||||
}
|
||||
|
||||
.waveform-visualizer-control-panel .wvc-row-mode,
|
||||
/* Row 1 (MODE): two direct flex children — the left toggle group and the color knob tooltip wrapper.
|
||||
space-between pins the color knob to the far right and keeps it there when collisions hides. */
|
||||
.waveform-visualizer-control-panel .wvc-row-mode {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/* Row 2 (LAVA): label + four knobs group left — no right-pinned control. */
|
||||
.waveform-visualizer-control-panel .wvc-row-section {
|
||||
/* space-between pushes the right-pinned control to the far edge; the left group holds the rest. */
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
/* Row 3 (WAVE): label + scroll-slider + width-knob tooltip wrappers are direct flex children.
|
||||
space-between pins the width knob to the far right while the label + slider sit left. */
|
||||
.waveform-visualizer-control-panel .wvc-row-wave {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
@@ -446,11 +458,6 @@ h2, h3, h4, h5, h6,
|
||||
gap: 0.85rem 1rem;
|
||||
}
|
||||
|
||||
/* The right-pinned control (color in row 1, width in row 3) — sits as the space-between right sibling. */
|
||||
.waveform-visualizer-control-panel .wvc-row-right {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
/* ── Section label "LAVA:" / "WAVE:" (§3, §5). NowPlayingCard .np-label TYPOGRAPHY (mono, uppercase,
|
||||
tracked), recoloured LIGHT — labels are static, so light by the colour principle (§5, §10.3). ── */
|
||||
.waveform-visualizer-control-panel .wvc-section-label {
|
||||
@@ -506,7 +513,7 @@ h2, h3, h4, h5, h6,
|
||||
attribute). The doubled .mud-overlay-scrim.mud-overlay-dark selector (0,2,0) outranks MudBlazor's own
|
||||
.mud-overlay-dark (0,1,0), so the tint wins regardless of stylesheet load order. ── */
|
||||
.waveform-visualizer-control-overlay .mud-overlay-scrim.mud-overlay-dark {
|
||||
background-color: rgba(13, 27, 42, var(--deepdrft-modal-scrim-alpha));
|
||||
background-color: rgba(var(--deepdrft-scrim-rgb), var(--deepdrft-modal-scrim-alpha));
|
||||
}
|
||||
|
||||
.waveform-visualizer-control-overlay .mud-overlay-content {
|
||||
|
||||
@@ -20,6 +20,10 @@
|
||||
/* Thin light-on-dark border, NowPlayingCard spirit (Phase 15 §5). One token instead of scattering
|
||||
the rgba(250,250,248,0.12) literal NowPlayingCard uses inline. */
|
||||
--deepdrft-border-light: rgba(250, 250, 248, 0.12);
|
||||
/* Modal scrim base colour (RGB triple for use in rgba()) — panel dark-ground (#0D1B2A).
|
||||
Deliberately NOT --deepdrft-navy (#112338); tokenised here so the scrim rule in
|
||||
deepdrft-styles.css has no hardcoded literals. Change here once. */
|
||||
--deepdrft-scrim-rgb: 13, 27, 42;
|
||||
/* Modal scrim opacity — the SINGLE point of truth for the visualizer-controls overlay tint
|
||||
(Phase 15 §4/§10.5). Mild so the panel reads as modal without a blackout. Change here once. */
|
||||
--deepdrft-modal-scrim-alpha: 0.3;
|
||||
|
||||
Reference in New Issue
Block a user