Molecule
Pane head
It names what the pane is showing, and it stays while the evidence scrolls under it. 48 instances across 48 screens.
On a surface where the analyst is deciding, the thing she is deciding about may not leave the screen. That is the whole of the sticky, and it is why the head carries the case identifier rather than the word Case.
Anatomy
dark, shipped
C-4417
Meridian Health · opened 26m ago
light, the pair
C-4417
Meridian Health · opened 26m ago
.pane-headsticky at the top of the pane, on the pane’s own ground throughbackground: inherith2the case, the tenant or the word Fleet. The one heading the pane is allowed.subthe same subline under a pane title and under a dialog title. It was one rule and an identical inline copy on three dialog generators until stage 07chips-hdits own molecule, on 7 of the 48
Behaviour at width
Below 1280, the system's one point (Width), the padding drops from --space-4 to --space-3, and on the standalone route the h1 drops from --size-xl to --size-lg. Nothing else moves. It is sticky in the pane at every width and static on the standalone route at every width, because what decides that is the route rather than the window.
Variants
| Axis | Value | Uses | The rule |
|---|---|---|---|
| route | in the pane | 45 | the title is an h2, and the pane sits beside the queue |
--standalone | 3 | the case has its own address, for a permalink and for a phone at 03:00. The title becomes the page’s h1, it stops being sticky because there is nothing beside it to scroll past, and three zones arrive | |
| emphasis | no values | – | There is one heading per pane and it is already the loudest thing on the surface |
That is a zone appearing, which by the anatomy rule would make it a different component. It is kept as a variant on one ground: the three zones are the SHELL the standalone route has to grow, not a different head, and every zone the paired form has survives in the same order. It is the closest call in this level and it is named rather than assumed.
When to use it
At the top of the detail pane, once, on every screen that has a pane. The fleet gets one too, and its title is the word Fleet: CLAUDE.md requires the resting pane to read as the fleet rather than as empty, and the head is the first half of that.
Where she meets it. Every time she opens a case, and again when she scrolls back up and finds it still there.
Rule and anti-rule
Do
C-4417
Meridian Health · opened 26m ago
The identifier, then the tenant and the age. She can quote the first line into a ticket and the second tells her whose problem it is.
Do not
Case details
Never a generic title. Case details names the screen and not the case, and the analyst has forty tenants and eighteen cases open in her head.
Limits
Rules of composition and context, which no anti-rule can carry: nothing else is the right component to take, and what is wrong is the count or the neighbour. Counted on the grey corpus at stage 09, and every one of them is a function in design/kit/checks/rules.mjs. Full table with sources on Architecture.
- R11. One
h1per screen. Closed in colour at stage 12:node design/kit/checks/rules.mjs designprints 0 broken. Still open in grey on twenty one screens, where at 360 there is noh1at all, because there the heading is the queue readout and the list column is not rendered. It stays open becausewireframes/is frozen and not because a coloured screen is wrong.
States
It has none, and it is not interactive.
dark, shipped
C-4417
Meridian Health · opened 26m ago
light, the pair
C-4417
Meridian Health · opened 26m ago
It takes its ground from the pane with background: inherit rather than declaring one, so a paper pane and a console pane both get a head that matches. That is one declaration doing the work of a variant.
What it reads, and where it stands
| Role | Surface | Where on the component | Dark | Light |
|---|---|---|---|---|
--text-primary | ink 4.5:1 | the title | ||
--text-secondary | ink 4.5:1 | the subline | ||
--line-edge | line, exempt | the border under it, through --rule-edge |