fix(feed): don't tell people to click an indicator that isn't a button

The saved pip borrowed the bookmark button's label, so it read "Saved —
click to remove" on a plain span: hover, be told to click, click, nothing.
It gets its own "Saved" string. The status markers drop their sr-only
twin too — with a title already carrying the meaning, a screen reader
that surfaces title text said it twice.
This commit is contained in:
2026-07-17 00:45:06 +02:00
parent 3de7e0ba0e
commit e52fba8b07
3 changed files with 8 additions and 5 deletions
+6 -5
View File
@@ -171,19 +171,20 @@ function RowMetaCells({ video }: { video: Video }) {
<span className="text-right tabular-nums"> <span className="text-right tabular-nums">
{video.duration_seconds != null ? formatDuration(video.duration_seconds) : ""} {video.duration_seconds != null ? formatDuration(video.duration_seconds) : ""}
</span> </span>
{/* `title` carries the meaning for both a hover and a screen reader — no sr-only twin, or an
SR that surfaces title text says it twice. These are indicators, NOT the controls in
Actions: the label must not tell anyone to click something that doesn't respond. */}
<span> <span>
{StatusIcon && ( {StatusIcon && (
<span title={status.label}> <span title={status.label}>
<StatusIcon className={clsx("w-3.5 h-3.5", status.cls)} aria-hidden="true" /> <StatusIcon className={clsx("w-3.5 h-3.5", status.cls)} />
<span className="sr-only">{status.label}</span>
</span> </span>
)} )}
</span> </span>
<span> <span>
{video.saved && ( {video.saved && (
<span title={t("card.savedRemove")}> <span title={t("card.savedMark")}>
<Bookmark className="w-3.5 h-3.5 text-accent fill-current" aria-hidden="true" /> <Bookmark className="w-3.5 h-3.5 text-accent fill-current" />
<span className="sr-only">{t("card.savedRemove")}</span>
</span> </span>
)} )}
</span> </span>
+1
View File
@@ -4,6 +4,7 @@
"watchedUnmark": "Watched — click to unmark", "watchedUnmark": "Watched — click to unmark",
"markWatched": "Mark watched", "markWatched": "Mark watched",
"savedRemove": "Saved — click to remove", "savedRemove": "Saved — click to remove",
"savedMark": "Saved",
"saveForLater": "Save for later", "saveForLater": "Save for later",
"unhide": "Unhide", "unhide": "Unhide",
"hide": "Hide", "hide": "Hide",
+1
View File
@@ -4,6 +4,7 @@
"watchedUnmark": "Megnézve — kattints a visszavonáshoz", "watchedUnmark": "Megnézve — kattints a visszavonáshoz",
"markWatched": "Megnézettnek jelöl", "markWatched": "Megnézettnek jelöl",
"savedRemove": "Mentve — kattints az eltávolításhoz", "savedRemove": "Mentve — kattints az eltávolításhoz",
"savedMark": "Mentve",
"saveForLater": "Mentés későbbre", "saveForLater": "Mentés későbbre",
"unhide": "Megjelenítés", "unhide": "Megjelenítés",
"hide": "Elrejtés", "hide": "Elrejtés",