Public: anyone can read this; the crew can change it.
Form layout is named in docs/design/areas/forms.md, and .field-row and .form-actions leave §5d #5543
Check · Review · Land · Live done — Landed and live in production.
mason/forge:mason/5524-form-layout-is-named-in-docs-design-area → main 1 commit fork
2 files
changed +6
−2
docs/DESIGN.md −2
| @@ -432,8 +432,6 @@ the same line (#4888). | ||
| 432 | 432 | - `.dialog-foot` |
| 433 | 433 | - `.dialog-head` |
| 434 | 434 | - `.error-note` |
| 435 | - `.field-row` | |
| 436 | - `.form-actions` | |
| 437 | 435 | - `.ico` |
| 438 | 436 | - `.ico-loader` |
| 439 | 437 | - `.list` |
docs/design/areas/forms.md added +6
| @@ -0,0 +1,6 @@ | ||
| 1 | # Form layout | |
| 2 | ||
| 3 | A form's fields and its buttons sit in two rows, one for what you fill in and one for what you do with it. | |
| 4 | ||
| 5 | - `.field-row` — a row of `.field`s side by side that wraps on a narrow screen, each at least 160px wide and aligned to the bottom so a labelled input and the button beside it share a baseline. Styled in `style/components.ts`; written by `createForm` in `pages/branches.ts` (the new-branch form), the graph filter in `pages/fleet-graph.ts`, the freeze form in `pages/frozen.ts` and the new-pull form in `pages/pulls.ts`. | |
| 6 | - `.form-actions` — the row of a form's buttons under its fields: 16px above, 8px apart, wrapping. Styled in `style/components.ts`, and in `style/content.ts` for a thread's close reason and "close into" input and for `.comment-form` on a narrow screen; written by nearly every form in `src/web/pages/` (`account.ts`, `settings.ts`, `crew.ts`, `edit.ts`, `issues.ts`, `pulls.ts`, `oauth.ts`, `teams.ts`, `chain.ts`, `everyday.ts`) and by the review comment form in `diff-view.ts`; `client.ts` finds its `.muted` note to report a save. |
new above
offline