Closes #3448. New ui/ primitives: FormField (shared label+control wrapper), TextField, SelectField, Button — each with a min-height touch target (2.75em ~= 44px, WCAG 2.5.5) per mara's #3447 ask, and a max-width instead of a fixed width so the control caps on desktop without overflowing a narrow/touch viewport. CreateAgentPage's name field + submit button now come from the kit instead of page-scoped CSS; ComponentsPage gets a section for each new primitive with an editable sample.
26 lines
686 B
CSS
26 lines
686 B
CSS
/* <Button> — same touch-target floor as `.ui-form-control`
|
|
(../form-field/FormField.css: 2.75em ≈ 44px at the default root font,
|
|
WCAG 2.5.5) so a button never reads as a smaller tap target than the
|
|
input sitting next to it. Colours are the shared base16-derived vars
|
|
(../../theme.css). */
|
|
.ui-button {
|
|
border-radius: 0.3em;
|
|
padding: 0.5em 1.2em;
|
|
font: inherit;
|
|
cursor: pointer;
|
|
min-height: 2.75em;
|
|
}
|
|
.ui-button-primary {
|
|
background: var(--purple-dim);
|
|
color: var(--fg);
|
|
border: none;
|
|
}
|
|
.ui-button-default {
|
|
background: var(--bg-elev);
|
|
color: var(--fg);
|
|
border: 1px solid var(--border);
|
|
}
|
|
.ui-button:disabled {
|
|
opacity: 0.6;
|
|
cursor: default;
|
|
}
|