Form Layouts
Four field arrangements this kit supports — single column, two column, label-left, and a scrolling card with a fixed action bar. Narrow the window to check each one below sm.
1. Single column
The default choice for short, focused forms — modals, quick-add drawers, first-run setup.
2. Two column
Balances information density with scannability — collapses to a single column below sm, so no field ever gets cramped on a phone.
3. Label-left
Common in settings screens, where labels are scanned down the left edge. Falls back to a stacked label above each control on narrow screens.
4. Card with a sticky action bar
Long forms benefit from actions that stay reachable — the fields scroll inside a fixed-height card, the bar at the bottom never does. The same header/body/footer split UiModal and UiDrawer already use.