Organism, and it contains another
Brief
Pick up and hand off a shift, which is the second of the three MVP jobs. 7 instances across 7 screens, filling Z4 on the shift screens. It is the only surface in the product that is neither a list nor a case: a document the analyst reads once at the start and once at the end, and seals.
Six steps of gap rather than five. pane body uses --space-5 between its blocks and this uses --space-6, because the brief is read standing up in one pass and its sections are unrelated to each other: what moved, what is counted, who is on. The pane’s sections are all about one case.
It stops rows from scrolling. A handover is read from the top in one pass, so a scroll box inside a scrolling document is a second scrollbar nobody asked for. That rule is here, in the container that changes it, rather than in rows, which would then have to know where it is standing.
Anatomy
A scaled scene, not a diagram. The thing worth showing here is the gap between the sections and the fact that the list inside does not scroll, and neither survives a block drawing. This is the real markup in a smaller box: real tracks, real type, real --space-6. The height is the fiction, 540px against twelve hours, and the box scrolls where Z4 scrolls.
dark, shipped
What waits on a decision
18waiting on a decision across 12 of 40 tenants in your scopeopen the queue →What moved this shift
Three moved, and the Meridian rejection has no log entry because its write never landed.
--space-6 between the sections, and the list inside does not scroll
light, the pair
What waits on a decision
18waiting on a decision across 12 of 40 tenants in your scopeopen the queue →What moved this shift
Three moved, and the Meridian rejection has no log entry because its write never landed.
--space-6 between the sections, and the list inside does not scroll
.briefthe document. A flex column that grows into Z4, scrolls on its own, and pads--space-5over--space-4gap: --space-6the one declaration that separates it from a pane body. Six steps between sections that are about different things, five between sections that are about one case.brief .rowsthe rule that lives in the container rather than in the child.flex:0 0 auto,overflow:visibleand a hairline on top, which turns the queue’s scroll box into a run of lines read from the toprows-movedthe list of what changed, holding row moved at--row-tracks-moved: four zones where the queue row has seven. No severity and no to check, because a pointer in a handover already happenedbline, block, banner, gnotewhat fills it. The counted lines, the sections, the one thing said about the whole page, and the note under a list
Variants
There are none. Seven screens, one form, and the empty axes are shown rather than skipped because the third of them is a live decision rather than an omission.
| Axis | Value | Uses | The rule |
|---|---|---|---|
| shift state | no values | – | Coming on, going off, assembling, sealed, unsealed, nothing carried, close failed. All seven are content and none of them is a form. What changes is what the sections say and which buttons the pane foot carries, and the foot is not this component |
| density | no values | – | Prohibited. The brief is the one surface read once at the start of twelve hours rather than forty times a shift, which is why it is allowed six steps of gap and why nothing may take them back |
| viewport | no values | – | It is a desk surface, and the decision is carried by a banner rather than by a modifier. At 360 a banner only-narrow says so and points at the queue. The phone has one scenario in this product, a paged case read and escalated, and reading a twelve hour handover is not it |
When to use it
On the shift screens, filling Z4, and nowhere else. If the surface is a list of things to decide it is rows in Z4; if it is one case it is pane body in Z5; the brief is the third thing, and there is one of it.
Where she meets it. Twice in twelve hours, at both ends, standing up and about to leave or having just sat down. That is the whole design constraint: read in one pass, and never searched. The counted lines are what she takes away, the moved list is what she checks against her memory of the night, and the seal is the only control on the surface.
Rule and anti-rule
Do
The list runs to its end inside the document. Nothing is hidden below a fold that belongs to a box rather than to the page.
Do not
Never a scrolling rows here. rows is the scroll container of the queue, where two hundred lines go past a scope bar that stays. Inside a handover it puts a second scrollbar in a document that already scrolls, and the last thing that moved is the thing it hides.
States
It has none, and it is not interactive. The counted lines that point at the queue carry theirs, and the seal is a button in the pane foot beside it rather than a control on this surface.
dark, shipped
light, the pair
The first line opens the queue and the second goes nowhere, on purpose: a shift where Clerk closed nothing alone and a shift where it closed a dozen are different shifts, and there is nowhere in the MVP to review them. Put the pointer on both and only one answers.
What it reads, and where it stands
| Role | Surface | Where on the component | Dark | Light |
|---|---|---|---|---|
--bg-page | fill | inherited from Z4, never set here. The brief paints nothing | ||
--line-separator | line, exempt | the hairline it puts above a list that has stopped scrolling | ||
--text-primary | ink 4.5:1 | inherited. Every colour on this surface belongs to something inside it |