a11y(e4): aria-label on the icon-only Plex watched-toggle buttons
The hover watched-toggle on Plex movie/episode cards is icon-only (WatchedIcon, no text), so it carried a `title` but no accessible name for screen readers — and the empty-Circle unwatched glyph could read like a radio. Mirror the title into `aria-label` (the Modal close-button idiom) so the control announces its action. The PlexInfo watched buttons already have visible text labels, so they need nothing. FE gate green (tsc/eslint/prettier/knip, 309 vitest).
This commit is contained in:
@@ -100,6 +100,7 @@ export function PlexPosterCard({
|
||||
onToggleWatched(card);
|
||||
}}
|
||||
title={card.status === "watched" ? t("plex.markUnwatched") : t("plex.markWatched")}
|
||||
aria-label={card.status === "watched" ? t("plex.markUnwatched") : t("plex.markWatched")}
|
||||
className="absolute top-1.5 right-1.5 p-1 rounded-full bg-black/60 reveal hover:bg-black/80 transition"
|
||||
>
|
||||
<WatchedIcon watched={card.status === "watched"} />
|
||||
@@ -438,6 +439,7 @@ export function EpisodeCard({
|
||||
onToggleWatched();
|
||||
}}
|
||||
title={ep.status === "watched" ? t("plex.markUnwatched") : t("plex.markWatched")}
|
||||
aria-label={ep.status === "watched" ? t("plex.markUnwatched") : t("plex.markWatched")}
|
||||
className="absolute top-1.5 right-1.5 p-1 rounded-full bg-black/60 reveal hover:bg-black/80 transition"
|
||||
>
|
||||
<WatchedIcon watched={ep.status === "watched"} />
|
||||
|
||||
Reference in New Issue
Block a user