Label the chapter field for the number it holds

The edit panel's only visible text was "Latest known: Ch 30" sitting directly
above a field pre-filled with your own progress — so on the one occasion the
form is worth opening, when those two numbers differ, the visible label named
the wrong one. Correcting a chapter number is this UI's stated primary job.

The field gets a real label ("Chapter you're on", tied by for/id, replacing the
screen-reader-only aria-label) and "Latest known" moves below it as context.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
2026-07-30 22:25:04 +07:00
parent 8b7bf27796
commit a6d245c25e
+7 -3
View File
@@ -89,13 +89,17 @@
hx-post="/ui/bookmarks/{{.Key}}/chapter"
hx-target="[id='card-{{.Key}}']" hx-swap="outerHTML"
hx-indicator="[id='card-{{.Key}}']" hx-disabled-elt="input, button">
{{if .LatestChapter}}<p class="hint">Latest known: {{.DisplayLatest}}</p>{{end}}
{{/* The field holds your progress; "Latest known" is the published chapter.
Those are different numbers whenever this form is worth opening, so the
label names the field and the latest sits after it as context. */}}
<label class="hint" for="chapter-{{.Key}}">Chapter you're on</label>
<div class="field">
{{/* max is a fat-finger guard, not a real ceiling — no series is near it. */}}
<input name="chapter" type="number" step="0.1" min="0" max="9999"
value="{{.LastChapterNum}}" aria-label="Chapter number" required>
<input id="chapter-{{.Key}}" name="chapter" type="number" step="0.1" min="0" max="9999"
value="{{.LastChapterNum}}" required>
<button type="submit">Save</button>
</div>
{{if .LatestChapter}}<p class="hint">Latest known: {{.DisplayLatest}}</p>{{end}}
</form>
{{/* One confirm row per way a series leaves the list. aria-live announces the
step to a screen reader, which otherwise gets no word that the tap