fix(i18n): every label a screen reader or tooltip says is translated

- The Plex playlist rows' "reorder"/"remove", the Plex filter chip's "remove" and the player
  slider's "reset" were English literals; each now names its row or setting in HU/EN.
- The playlist show header's chevron had no accessible name; its decorative thumbnail button left
  the tab order.
- The opt-in Glass tuner panel was English only: every word is translated, and each slider's label
  now names its number box and range.
- New `local/literal-a11y-text` lint rule (with its contract test): a literal word in aria-label,
  title, placeholder, alt and the other spoken/shown attributes fails lint.
This commit is contained in:
2026-09-19 17:12:47 +02:00
parent 7b94e9a651
commit 4f72b193aa
13 changed files with 325 additions and 70 deletions
@@ -1,4 +1,5 @@
import { type ReactNode } from "react";
import { useTranslation } from "react-i18next";
import { RotateCcw } from "lucide-react";
import { FocusSafeButton } from "./ui/FocusSafeButton";
@@ -70,6 +71,7 @@ export function Slider({
onChange: (v: number) => void;
onReset?: () => void;
}) {
const { t } = useTranslation();
return (
<div className="px-1 py-1">
<div className="mb-1 flex items-center justify-between text-[0.75rem] text-white/80">
@@ -80,7 +82,11 @@ export function Slider({
{suffix ?? ""}
</span>
{onReset && (
<button onClick={onReset} className="text-white/40 hover:text-white" aria-label="reset">
<button
onClick={onReset}
className="text-white/40 hover:text-white"
aria-label={t("common.resetNamed", { name: label })}
>
<RotateCcw className="h-3 w-3" />
</button>
)}