Settings
The settings grammar: page → group → rows → row, and nothing else. The call site chooses a row and a control; the primitives own every measure, hairline and margin, which is what stops a settings surface growing competing section styles.
The nesting
Email delivery
Sending
Send email to clients
Sender address
Address
Domain verification
Six control slots, and there is no seventh
Footer, for text entry only
Display name
Only text entry earns a footer. Toggles and selects save on change, so a Save button beside them would be lying about what commits. The presence of a footer is itself the signal that something in this group needs committing.
Disabled is really disabled
Push transactions to Hoowla
Default case assignee
Workflow IDs
The control sits in a disabled <fieldset>, so the
keyboard is locked out too, and a disabled drill-in renders no link at all. The settings pages
this replaces used opacity-60 pointer-events-none, which
stopped the mouse and nothing else. A keyboard user could tab in and change a setting the page
was telling them was off.
Group actions and empty groups
Document categories
Enquiry types
No enquiry types yet
Add one and it becomes selectable on every new enquiry.
Reorderable rows
Setting sortable-id grows the grip and the
data-sortable-* hooks
sortable-rows.mjs reads. The row restructures itself so
the handle sits outside the link, because a button inside an anchor is not valid HTML. A list
that can be reordered stays a list of rows; it does not become a table just to fit a handle in.
Keyboard users nudge with the up and down arrows.
Non-row content
Channels available
| Notification | In app | |
|---|---|---|
| Quote accepted | ||
| Document uploaded |
A block takes the same inset a row does, so a group that mixes rows with one matrix keeps a
single left edge. Reach for a row first. A block is for content with its own internal
structure. A page whose content is a matrix also sets
width="Wide", because a grid of toggles is not prose
and capping it to a reading measure just pushes its own columns together.
API
string (page, group, row)string? (page, group, row)string? (row: the current answer, before the chevron)string? (row: makes the whole row a drill-in)bool (row: open href in a side tray)bool (row: wraps the control in a disabled fieldset)string? (row: replaces the description while disabled)StandardWide (page: Wide for a matrix)string? (row: grip handle plus the sortable hooks)string? (page, group, rows, row, block: outer spacing only)