discourse/app/assets/stylesheets/common/form-kit/_variables.scss
Kris e2dcaf5b01
UX: wider inputs, centered form, and footer controls for simplified category creation (#37964)
This is scoped to the upcoming change: simplified category creation.

This centers our category creation form and allows it to be a little
wider with a new formkit variable

`--form-kit-max-input: 75ch;`

This makes inputs and other related elements `75ch` wide, which is
maximum recommended line length for readability.

The form has also been updated to use a sticky footer that indicates
changes and provides an more readily available way to save.

I've also converted plugin additions to formkit and made setting changes
there reactive.

<img width="500" alt="image"
src="https://github.com/user-attachments/assets/255b5333-457b-4dfd-a92b-631f847def5b"
/><img width="500" alt="image"
src="https://github.com/user-attachments/assets/c48ddd5d-f54d-4a99-b459-90af0b29c8cf"
/>

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2026-02-26 11:40:58 -05:00

8 lines
197 B
SCSS
Vendored

:root {
--form-kit-gutter-x: 1rem;
--form-kit-gutter-y: 1rem;
--form-kit-max-input: 75ch;
--form-kit-large-input: 325px;
--form-kit-medium-input: 200px;
--form-kit-small-input: 75px;
}