feat(design): C5 recorded, every E28 decision taken
The owner's lean Plex control set with both refinements (Back by position, a touch double-tap for the 10 s skip) goes into DESIGN.md's Players chapter and the log. The lab is now the reference only.
This commit is contained in:
@@ -3,10 +3,7 @@ import clsx from "clsx";
|
||||
import { SCHEMES, type Scheme } from "../lib/theme";
|
||||
import { BatchA } from "./batchA";
|
||||
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 controls", render: C5 }] as const;
|
||||
import { BatchC } from "./batchC";
|
||||
|
||||
// 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 /
|
||||
@@ -93,15 +90,6 @@ export default function DesignLab() {
|
||||
/>
|
||||
</label>
|
||||
<nav className="flex flex-wrap gap-1 text-xs">
|
||||
{OPEN.map((d) => (
|
||||
<a
|
||||
key={d.id}
|
||||
href={`#${d.id}`}
|
||||
className="rounded-md px-1.5 py-0.5 text-muted hover:bg-card hover:text-fg"
|
||||
>
|
||||
{d.code} {d.title}
|
||||
</a>
|
||||
))}
|
||||
<a href="#decided" className="rounded-md px-1.5 py-0.5 text-success hover:bg-card">
|
||||
A ✓
|
||||
</a>
|
||||
@@ -116,15 +104,12 @@ 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 Plex player controls</h1>
|
||||
<h1 className="text-2xl font-bold">The design reference</h1>
|
||||
<p className="text-sm text-muted">
|
||||
Each decision shows its variants with the app's real CSS. The framed one is the
|
||||
recommendation. Resize the window to tablet size to see them there too.
|
||||
Every rule of docs/DESIGN.md in its chosen rendering, with the app's real CSS.
|
||||
Resize the window to tablet size to see them there too.
|
||||
</p>
|
||||
</header>
|
||||
{OPEN.map((d) => (
|
||||
<d.render key={d.id} />
|
||||
))}
|
||||
<header id="decided" className="mt-6 scroll-mt-20">
|
||||
<h2 className="text-xl font-bold">Decided · batch A, controls</h2>
|
||||
<p className="text-sm text-muted">
|
||||
|
||||
Reference in New Issue
Block a user