Move the console onto ReUI PRO
Install ReUI (MCP, skill, @reui registry, Tailwind v4, shadcn base-nova) and move the shared UI onto it: Button, Tag, Check, Input/Textarea, Segmented, Alert, Panel, Dialog, Tooltip, Menu and Select (Popover), Toast (sonner), the Table frame (DataGrid), the Dashboard KPI strip, the shnt Ops palette, Geist and the type scale. Design only: behaviour, texts and roles are unchanged. Tests that asserted the old DOM were updated; the tests now format numbers in English wherever they run. docs/reui-migration-plan.md records the plan and its decisions. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
commit
f3531c64f9
680 files changed
+139836
No files matched your search
@@ -0,0 +1,45 @@
|
||||
.check {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--s-6);
|
||||
/* The label IS the target: it is clicked from the text, not only from the box.
|
||||
At 22 px tall it fell short for a finger. */
|
||||
min-height: 26px;
|
||||
padding: var(--s-2) 0;
|
||||
font-size: var(--t-4);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* The box aligns with the label's first line, not with its box. */
|
||||
.text { min-width: 0; }
|
||||
|
||||
.help {
|
||||
composes: withCode from './text.module.css';
|
||||
font-size: var(--t-3);
|
||||
color: var(--mute);
|
||||
line-height: 1.55;
|
||||
margin-top: var(--s-3);
|
||||
margin-left: calc(var(--ctrl) + var(--s-6));
|
||||
/*
|
||||
720 px, and **it is a local exception with its figure**, not a missing token.
|
||||
|
||||
Decided 2026-09-03, in a design review. Measured
|
||||
first: **it really bites**. At 1920, with the control column at 1022 px, the nine
|
||||
checkbox helps of `Settings › General` come out at exactly 720, so it is not dead
|
||||
code that can be deleted.
|
||||
|
||||
And it does not go up to `tokens.css` for the same reason the Dashboard hero did
|
||||
not: **only this uses it**. A global token is declared when two places share a
|
||||
decision; declaring one for a single use is inventing vocabulary nobody speaks.
|
||||
|
||||
What the cap is and why it is not `--help-col`: this is **the only help the
|
||||
dense-form design did NOT move** to the third column. A checkbox's stays under its control
|
||||
(because the checkbox IS its label and separating them would break that unit), so
|
||||
it inherits the control column's width, which on wide screens goes well past
|
||||
what reads comfortably. 720 is the readable line cap for THIS case.
|
||||
|
||||
If some day a second help stays out of the third column, then there are two and
|
||||
a token is due; today there are nine from the same place.
|
||||
*/
|
||||
max-width: 720px;
|
||||
}
|
||||
Reference in new issue
Block a user