Two-pane object show — sketch

Archetype 2 / R7. A first cut of the show shell: identity rail, record toolbar, collapsible sections over .dl-dense, tabbed right pane with live counts. Nothing here is a component yet — the point is agreeing the shape.

This page deliberately adds no CSS to the gem. rail, rail-head and rail-section are drawn here with utilities and a native <details>, so the shape can be argued before any of it is named. The disclosure and tooltip components R7 calls for are not built — the collapsible sections are the browser's, and the audit detail is a plain title attribute.

CodeDescription QtyUnit Ex GSTDelivered
PMP-100 Centrifugal pump, 2in 4 620.00 2,480.00 ✓
PMP-104 Impeller, bronze 6 148.50 891.00 ✓
SEA-220 Mechanical seal kit 12 96.40 1,156.80 ✓
HOS-310 Suction hose, 6m 3 410.00 1,230.00 —
VLV-440 Gate valve, 100mm 8 268.75 2,150.00 —
FIT-505 Camlock fittings, set 10 88.20 882.00 ✓
GSK-610 Gasket set 20 31.45 629.00 —
LBR-700 Installation labour 12 155.00 1,860.06 ✓

What still has to be decided

The rail is 350px and the sections are .dl-dense, which is what lets ~25–30 label/value pairs sit in view the way legacy's does. At .dl-row the same rail shows roughly two thirds of that — see the Density page.

Open questions for R7: whether rail-section is a real component or just card + details; whether section open/closed state persists per user; whether the next-action callout is a named component (it is the rail's most valuable behaviour and the easiest to lose in a port); and what the tooltip is, since title is not reachable by keyboard.