- Issue created by @jnettik
- First commit to issue fork.
- Merge request !194#3501793: Cleaned up input styles to be less specific. → (Open) created by jnettik
- Assigned to jldust
The base styles for inputs is very general and should be a bit more targeted. Currently we have:
input, textarea { @include type-scale(label, 16); background-color: var(--prototype-color-white); border: solid 1px var(--prototype-color-dark); border-radius: 0; max-width: 100%; padding: 8px 12px; }
The broad input specifically targets texted based inputs, submit/reset inputs, checkboxes/radios. We don't want those to be styled the same way by default.
Break things out into clearer and more targeted selectors. Group texted based inputs with:
input[type="text"], input[type="password"], input[type="date"], input[type="email"], input[type="number"], textarea {}
There are a lot of other types like tel that should be in this list. I could also see adding select as they often share a lot of similarities.
Move things typically button like into:
input[type="submit"], input[type="reset"] {}
And then finally update the base styles for checkboxes/radios to not assume Drupal specific field markup. Remove the .form-type__checkbox|radio selector and simply use:
input[type="checkbox"], input[type="radio"] { // Styles... + label[for] {} }
Active
5.2
Code