Work the design critique down: chapter format, colour law, search, strip, a11y #11
@@ -89,13 +89,17 @@
|
|||||||
hx-post="/ui/bookmarks/{{.Key}}/chapter"
|
hx-post="/ui/bookmarks/{{.Key}}/chapter"
|
||||||
hx-target="[id='card-{{.Key}}']" hx-swap="outerHTML"
|
hx-target="[id='card-{{.Key}}']" hx-swap="outerHTML"
|
||||||
hx-indicator="[id='card-{{.Key}}']" hx-disabled-elt="input, button">
|
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">
|
<div class="field">
|
||||||
{{/* max is a fat-finger guard, not a real ceiling — no series is near it. */}}
|
{{/* 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"
|
<input id="chapter-{{.Key}}" name="chapter" type="number" step="0.1" min="0" max="9999"
|
||||||
value="{{.LastChapterNum}}" aria-label="Chapter number" required>
|
value="{{.LastChapterNum}}" required>
|
||||||
<button type="submit">Save</button>
|
<button type="submit">Save</button>
|
||||||
</div>
|
</div>
|
||||||
|
{{if .LatestChapter}}<p class="hint">Latest known: {{.DisplayLatest}}</p>{{end}}
|
||||||
</form>
|
</form>
|
||||||
{{/* One confirm row per way a series leaves the list. aria-live announces the
|
{{/* 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
|
step to a screen reader, which otherwise gets no word that the tap
|
||||||
|
|||||||
Reference in New Issue
Block a user