fix(ui): the platform layer speaks platform words; boxes scale with the text

- PriorityStepper labelled itself with channels.row.* and told every caller
  it orders the Feed; Combobox said plex.loading / plex.filter.moreRefine /
  sidebar.match on the feed sidebar. The generic strings moved to common.*,
  and what a priority MEANS arrives as the stepper's `hint` prop.
  uiI18n.contract.test.ts pins components/ui/ to the platform namespaces —
  the import boundary could never see an i18n key.
- 32 px-frozen box utilities (w-[150px], max-w-[1600px], left-[18px], …)
  became spacing-scale steps (w-37.5, max-w-400, left-4.5): identical at the
  default text size, and now they grow with the Settings slider instead of
  clipping or re-wrapping their own labels. An eslint rule refuses the px
  form beside the older text-[Npx] one, pinned by pxBox.contract.test.ts;
  measured in the browser that every new step is generated at its old px.
- chipLane's import-strip regex ran past a side-effect import into the next
  statement's `from`, hiding a lane between them; it now stops at the
  import's own `;`.
This commit is contained in:
2026-09-19 07:46:33 +02:00
parent 29875b7367
commit 8018cd4685
36 changed files with 223 additions and 75 deletions
+5 -5
View File
@@ -55,7 +55,7 @@ export function PlexInfoView({
const lang = plexLang();
const q = useQuery({ queryKey: qk.plexItem(id, lang), queryFn: () => api.plexItem(id, lang) });
return (
<div className="w-[90%] max-w-[1600px] mx-auto">
<div className="w-[90%] max-w-400 mx-auto">
<div className="p-4 pb-0">
<Button variant="glass" size="xs" onClick={onBack}>
<ArrowLeft className="w-4 h-4" />
@@ -168,7 +168,7 @@ export function PlexPersonView({
const d = q.data;
const empty = !!d && d.movies.length === 0 && d.shows.length === 0;
return (
<div className="w-[90%] max-w-[1600px] mx-auto">
<div className="w-[90%] max-w-400 mx-auto">
<div className="p-4 pb-0">
<Button variant="glass" size="xs" onClick={onBack}>
<ArrowLeft className="w-4 h-4" />
@@ -246,7 +246,7 @@ export function PlexPersonView({
keyboardNav
>
{d.known_for.map((c, i) => (
<div key={c.id} className="w-[150px] shrink-0">
<div key={c.id} className="w-37.5 shrink-0">
<PlexPosterCard
card={c}
navIndex={i}
@@ -360,7 +360,7 @@ export function PlexShowView({
}
return (
<div className="p-4 max-w-[1200px] mx-auto glass-media">
<div className="p-4 max-w-300 mx-auto glass-media">
<BackBtn onBack={onBack} label={t("plex.backToLibrary")} />
{q.isError && !q.data ? (
@@ -615,7 +615,7 @@ export function PlexSeasonView({
}
return (
<div className="p-4 max-w-[1200px] mx-auto glass-media">
<div className="p-4 max-w-300 mx-auto glass-media">
<BackBtn onBack={onBack} label={t("plex.series.backToShow")} />
{q.isError && !q.data ? (