Fix field-help review findings (Fable review + Opus verification)
Test and deploy / test-and-deploy (push) Successful in 1m25s

Highest severity: injected "?" buttons were hijacking the implicit
<label> association on 14 fields, so clicking the label text opened
the help dialog instead of focusing the input and screen readers lost
the input's accessible name. ensureLabelAssociation() now gives each
affected input an explicit id/for pairing before the button lands.

Also: milestones-ror/actuators topic placement is now text-matched
with a warning fallback instead of blind array indexing; every topic
warns if it resolves zero containers; dialog temperatures (milestone
table, RoR budget, worked example, both charge-setting tables) now
respect the °C/°F toggle instead of being stuck in °C; the print
worksheet's duplicate curve chart was missing the data-tempc
attributes its live counterpart had, so only its title/caption (not
its axis numbers) converted; the "?" trigger's touch target grew from
15px to a WCAG-conformant ~25px without changing the visual dot; two
genuine coverage gaps closed (a roast-log checklist topic, a
curve-reading topic); a worked feasibility example was restored; two
claims that didn't trace back to the source worksheet were corrected
(an invented "±15 seconds" sweet-spot tolerance, a wrong
moisture-to-time mapping); three cultivar cells regained detail lost
in the original transcription; a data-transcription footnote no
longer leaks into an unrelated topic; checklist items keep their list
semantics under VoiceOver.

Co-Authored-By: Fable <[email protected]>
Co-Authored-By: Opus <[email protected]>
This commit is contained in:
2026-07-31 07:17:44 -04:00
co-authored by Fable
parent 84fb396c7d
commit 0a0356b86e
7 changed files with 256 additions and 53 deletions
+33 -1
View File
@@ -493,6 +493,28 @@ label.filebtn input[type="file"] {
.help-body dl {
margin: 0;
}
.help-checklist {
list-style: none;
margin: 0 0 10px;
padding: 0;
display: flex;
flex-direction: column;
gap: 5px;
}
.help-checklist li {
position: relative;
padding-left: 20px;
}
.help-checklist li::before {
content: "";
position: absolute;
left: 0;
top: 5px;
width: 10px;
height: 10px;
border: 1.5px solid var(--line-strong);
border-radius: 2px;
}
.help-table-wrap {
overflow-x: auto;
margin: 6px 0 10px;
@@ -763,6 +785,7 @@ label.filebtn input[type="file"] {
gap: 4px;
}
.help-btn {
position: relative;
flex: 0 0 auto;
width: 15px;
height: 15px;
@@ -777,6 +800,14 @@ label.filebtn input[type="file"] {
align-items: center;
justify-content: center;
}
/* Keeps the 15px visual dot but gives touch/mouse a ~25px target (WCAG's 24px minimum) —
matters on a mobile PWA. Kept modest rather than the fuller 44px so it doesn't swallow
clicks meant for the label text 4px away or the input just below. */
.help-btn::after {
content: "";
position: absolute;
inset: -5px;
}
.help-btn:hover,
.help-btn:focus-visible {
border-color: var(--ember);
@@ -788,7 +819,8 @@ label.filebtn input[type="file"] {
outline-offset: 1px;
}
.subhead .help-btn,
.dock-card-head .help-btn {
.dock-card-head .help-btn,
.panel-head h2 .help-btn {
margin-left: 6px;
vertical-align: 1px;
}