Inventory / 03
Components
A compact set of real controls, feedback patterns, navigation primitives, data displays, and overlays. Every specimen below is live framework markup.
Buttons and icon controls
Action hierarchy stays explicit: red primary, bordered secondary, warm warning, critical danger, and low-emphasis ghost controls.
<button class="c19-button">Primary action</button>
<button class="c19-button c19-button--secondary">Secondary</button>
<button class="c19-button c19-button--warning">Caution</button>
<button class="c19-button c19-button--danger">Critical</button>
Forms and switches
Labels, hints, errors, native semantics, and visible focus states are treated as part of the component rather than optional annotation.
<label class="c19-field">
<span class="c19-field__label">Cruise velocity</span>
<span class="c19-input-group">
<input class="c19-input c19-mono" inputmode="decimal">
<span class="c19-input-group__addon">km/s</span>
<button class="c19-button c19-button--secondary">Apply</button>
</span>
</label>
Status, badges, alerts, and toast
Color never carries the full message: each state includes text and preserves semantic structure.
Telemetry queue is draining normally.
Bay 04 is 3.2 °C above target.
Checksum 8D-19 accepted.
Statistics, tables, and meters
Monospaced values, tabular numerals, restrained rules, and explicit units keep operational data scannable.
| Sector | State | Pressure | Access |
|---|---|---|---|
| A-01 | Nominal | 101.3 kPa | Open |
| C-04 | Cryogenic | 98.7 kPa | Restricted |
| V-07 | Vacuum | 0.0 kPa | Sealed |
Dialog, popover menu, and tooltip
Native dialog and popover behavior provide platform dismissal and focus handling. Tooltip content remains supplemental.
Command and code surfaces
Terminals are for telemetry and commands, not general body copy. The command bar preserves a real input and label.
SYS/ pressure --sector A01
101.3 kPa / stable
SYS/ cargo --verify manifest-19
checksum accepted / 00 errors
One-shot signal acquisition
Use the title cue for a single arrival moment, not persistent decoration. Its mirrored stagger resolves from the outside inward and becomes static under reduced motion.
Complete class index
The concise Markdown index is retained for source browsing; this themed page is the canonical visual reference.