this repo has no description
Fix label text splitting across multiple lines
CSS grid makes every direct child a separate grid item, so inline
elements like <sub> within label text were stacking vertically instead
of rendering inline. Wrap label text in <span class="lbl"> to group
all inline content into a single grid item, and add white-space: nowrap
to prevent long labels from wrapping.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
+7
-6
+1
style.css
+1
style.css
···
30
30
.controls .readouts { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
31
31
.transport { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 8px; }
32
32
label { font-size: 12px; color: var(--muted); display: grid; gap: 6px; }
33
+
label > span.lbl { white-space: nowrap; }
33
34
input[type="number"], input[type="range"], select {
34
35
width: 100%;
35
36
background: #0c1420; color: var(--ink);
+6
-6
tline_viz.html
+6
-6
tline_viz.html
···
27
27
<div class="cfg-row"><span>R<sub>g</sub> =</span><input id="Rg" type="number" step="0.1" value="20.0" /><span>(Ω)</span></div>
28
28
<div class="cfg-row"><span>R<sub>L</sub> =</span><input id="RL" type="number" step="0.1" value="30.0" /><span>(Ω)</span><button id="RLOpen" type="button" title="Open circuit (R_L = ∞)">∞</button></div>
29
29
<div class="cfg-extra">
30
-
<label>Segments (N)
30
+
<label><span class="lbl">Segments (N)</span>
31
31
<input id="segCount" type="number" min="1" max="10" step="1" value="1" />
32
32
</label>
33
-
<label>Z<sub>0</sub> per segment (Ω)
33
+
<label><span class="lbl">Z<sub>0</sub> per segment (Ω)</span>
34
34
<div id="segZ0List" class="seg-z0-list"></div>
35
35
</label>
36
36
</div>
37
37
<div class="cfg-extra">
38
-
<label>Time scale — <span id="secPerTauRead" class="mono">2.5</span> s per τ<sub>d</sub>
38
+
<label><span class="lbl">Time scale — <span id="secPerTauRead" class="mono">2.5</span> s per τ<sub>d</sub></span>
39
39
<input id="secPerTau" type="range" min="0.5" max="6" step="0.1" value="2.5" />
40
40
</label>
41
-
<label>Reflection termination tolerance (% of |V<sub>1</sub>|)
41
+
<label><span class="lbl">Reflection termination tolerance (% of |V<sub>1</sub>|)</span>
42
42
<input id="reflectTol" type="number" min="0" step="0.1" value="1" />
43
43
</label>
44
-
<label>Signal shape
44
+
<label><span class="lbl">Signal shape</span>
45
45
<select id="riseMode">
46
46
<option value="step">Step (instantaneous)</option>
47
47
<option value="linear">Linear ramp (trapezoidal)</option>
48
48
<option value="exp">Exponential rise (RC)</option>
49
49
</select>
50
50
</label>
51
-
<label>Rise time constant τ<sub>r</sub> / τ<sub>d</sub>
51
+
<label><span class="lbl">Rise time constant τ<sub>r</sub> / τ<sub>d</sub></span>
52
52
<input id="riseTau" type="number" min="0.01" max="5" step="0.01" value="0.1" disabled />
53
53
</label>
54
54
</div>