feat(design): C5 redrawn around the owner's reworked Plex controls

Stop, Restart and the 10 s skips leave the row, Back restarts or steps to
the previous episode, Next shows only when there is a next item, and the
card carries Resume + From the start. The lab asks back two points: how
Back tells restart from previous, and a touch path for the 10 s skip.
This commit is contained in:
2026-09-24 04:05:09 +02:00
parent f4bc60d659
commit 3f5634a44f
2 changed files with 128 additions and 70 deletions
+2 -2
View File
@@ -6,7 +6,7 @@ import { BatchB } from "./batchB";
import { BatchC, C5 } from "./batchC";
// The open decisions, in the order they are asked. The decided ones render below them as reference.
const OPEN = [{ id: "c5", code: "C5", title: "Player row", render: C5 }] as const;
const OPEN = [{ id: "c5", code: "C5", title: "Player controls", render: C5 }] as const;
// The design lab (E28): the living style guide. Dev-only — see main.tsx and devOnlyGuard.ts. It sits
// OUTSIDE <App>, so it owns the theme attributes on <html> itself, through the same data-theme /
@@ -116,7 +116,7 @@ export default function DesignLab() {
<main className="mx-auto flex max-w-screen-2xl flex-col gap-6 p-4">
<header>
<h1 className="text-2xl font-bold">Open · the player row on a narrow screen</h1>
<h1 className="text-2xl font-bold">Open · the Plex player controls</h1>
<p className="text-sm text-muted">
Each decision shows its variants with the app&apos;s real CSS. The framed one is the
recommendation. Resize the window to tablet size to see them there too.