- Also fixes the vertical alignment of labels in horizontal layouts on
account of the recent button and input padding changes
- Also changes the vertical alignment of the checkboxes and radios in
horizontal forms
- Add new mixin to generate and customize focus state as needed
- Adds variable to set default color
- Include clear disclaimer about customizing this—it's about users', so
don't go making everything bright red and expect them not to be
confused or alarmed.
Relevant issues: #2742, #4185, #7942, #8171, #8610, #9044
* Smaller padding on buttons and large buttons
* Same with inputs and large inputs
* Remove about 10px from height of large inputs/buttons and 4px from
regular ones
Fixes#8707 and #8700.
(Also relevant: #8711)
* Moves input groups CSS into separate file
* Moves input groups docs into the Components page
* Add support for radios and checkboxes in input groups to fix#8679
* No more need for `.row.form-group`--only need `.form-group`
* Change tag selectors for inline form to use `.form-control`
* Docs improved to explain what's happening
* Once again no longer applies to single inputs (this is a bit simpler,
but I'm open to new ideas) but the entire set of inputs, labels, and
help text within a particular element. However, the styles are not too
dependent on markup or layout, so they're super flexible.
* Simplified the markup in the validation docs examples to match latest
changes.
* Renamed `.form-state-validation` mixin to `.form-control-validation`
to match naming of prev commit.
* Reorganize forms.less
* Change from attribute selectors to `.form-control`. Few lines, less
specific (meaning easier overrides as `element[type=""]` is more
specific than a class), less intrusive, and more performant.
* Add `.form-group` for basic spacing in vertical forms.
* Remove (unnecessary?) `margin: 0;` from `form` element (as far as I
can tell no browser sets that anyway).
This particular form control is wildly inaccurate across browsers, so
we're removing the `height` and `line-height`, but adding `display:
block` so it renders similarly to our other inputs.
Restores `font-size` and more to the `<select>` element while also
changing from `min-height` to `height` for input sizing.
Fixes#8520 as opened by @ShaunR (would've merged that PR but I moved
everything around right before).