style: move user-confirm control under the header's hold-time display
Repositions #user-confirm-row from the header's own row to directly under #header-countdown's "hold" row, sharing a new #countdown-confirm- col column so header-countdown's 'hidden' toggle (only shown once a step is active) doesn't hide the confirm control along with it - a WAIT_USER confirm can happen before that countdown is visible. Kept the max-width + wrap safety (now min(60vw, 20em)) so a long confirmation message still wraps instead of pushing the header sideways on an iPad's narrower viewport, per the earlier upper-right-corner placement this replaces. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01M2ierBoxW3v7nUbDw3M2pE
This commit is contained in:
+10
-8
@@ -17,10 +17,16 @@
|
||||
<button id="btn-sud-start" class="transport-btn transport-start" title="Start / Resume">▶</button>
|
||||
<button id="btn-sud-pause" class="transport-btn transport-pause" title="Pause">▮▮</button>
|
||||
<button id="btn-sud-stop" class="transport-btn transport-stop" title="Stop">■</button>
|
||||
<span id="header-countdown" class="hidden">
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">total</span><span id="hdr-total-remaining">-:--:--</span></span>
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">ramp</span><span id="hdr-step-remaining">-:--:--</span></span>
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">hold</span><span id="hdr-hold-remaining">-:--:--</span></span>
|
||||
<span id="countdown-confirm-col">
|
||||
<span id="header-countdown" class="hidden">
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">total</span><span id="hdr-total-remaining">-:--:--</span></span>
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">ramp</span><span id="hdr-step-remaining">-:--:--</span></span>
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">hold</span><span id="hdr-hold-remaining">-:--:--</span></span>
|
||||
</span>
|
||||
<div id="user-confirm-row">
|
||||
<span id="user-confirm-text"></span>
|
||||
<button id="btn-user-confirm" type="button" disabled>Confirm</button>
|
||||
</div>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
@@ -30,10 +36,6 @@
|
||||
<input type="file" id="sud-file-input" accept="application/json" class="hidden">
|
||||
<button id="btn-sud-save">Save…</button>
|
||||
</div>
|
||||
<div id="user-confirm-row">
|
||||
<span id="user-confirm-text"></span>
|
||||
<button id="btn-user-confirm" type="button" disabled>Confirm</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="layout">
|
||||
|
||||
Reference in New Issue
Block a user