Is there a recommended way to override/alter the form styles in inuit.css?
The inuit.css/base/_forms.scss
has a rule setting label tags to display: block;
, which is breaking a CMS I'm using. Certainly I could modify this file, or remove the import from _inuit.scss
, but neither seems like a good approach.
Adding a rule in _vars.scss
, which is a recommended approach for overriding defaults doesn't work. Both rules end up in the compiled css file, and the built-in one takes precedence.
In css/style.scss
you add your own files like this:
/**
* She’s all yours, cap’n... Begin importing your stuff here.
*/
//@import "ui/example";
@import
"ui/base",
"ui/forms"
;
Now you override display: block;
in your own _forms.scss
:
label {
display: inline;
}
Notes:
_vars.scss
is the recommended way to override inuit.css variables, not styles – Use own imported CSS files to override styles (see above)