— Previously we weren't including the border-width on the computed height, leading to alignment issues.

— New system utilizes three variables (not ideal, but straightforward) for computing these heights. One for the vertical border, one for the line-height/font-size/padding dance, and one to add those together.

— Updates CSS across forms and custom forms to use new sizing. Special note here: form validation icon sizing uses the inner variables because background-image doesn't bleed into borders unless explicit background-clip.

* Fixed some linting issues

* Run npm tasks after scss cleanup

* Revert "Run npm tasks after scss cleanup"

This reverts commit 1103a0da.

* Property sort order for grid

* Let's respest the property order in the mixins

* Respect property sort order in reboot file

* ::-ms-expand is a vendor-prefix, add it to the scss-lint disable

* Revert hover mixin comment

* Fixed missing mixin hover-focus

* Remove most of custom cursor: pointer; implementations

* turns out that's not so much of a thing

Fixes #21135.

There's a height mismatch here because we're setting padding on the labels, while inputs get padding *and* a top+bottom border. This now uses calc to determine the exact height needed to match labels to inputs.

Rather than overriding this just on inline form examples, this should be for all static form controls to match inputs.

fixes broken inline form example mentioned in #21407

* remove the $enable-flex variable option

* remove bootstrap-flex.css dist file and it's grunt task

* remove the separate flex css file for docs; it's all the same now

* remove flexbox docs (porting some to the main grid docs in next commit)

* clean up few grid docs bits to simplify copy, start to mention flexbox

* port relevant flexbox-grid.md content to grid.md

- clean up mixins
- update how it works section
- bring over sizing and alignment sections

* remove the $enable-flex from the options.md page

* update lead paragraph to mention flexbox

* update migration to mention loss of ie9 support

* remove mention of flexbox dist file

* clarify IE support

* making a note

* remove flexbox variant mentions from component docs

- updates docs for media object, navs, list group, and cards to consolidate docs
- no more need to callout flexbox variants since it's now the default

* remove $e...

* Overwrite margin-bottom on form-control-static

In the documentation the form-control-static class has been used on a p element.
On the regular vertical form the margin bottom of the p element gets overwritten by a mb-0 class.
In the inline form example this class hasn't been applied, therefore the p element gets a margin-bottom.

To prevent this behavior we can add a margin-bottom of 0.

* Update _forms.scss

* Add variables for transitions

* Add variables for transitions

* #20936 make inline checkbox/radio markup same as stacked

* tweak language and remove extra blank line in snippet

* fix form-inline with flex enabled
* grunt
* fix alignment of labels
* shorter if syntax
* add new form example to docs for now
* update inline form docs usage guidelines
* responsive margins
* better margin utils
* fix sizing of .form-check
* flexbox alignment of .form-check
* no need to change direction
* support custom controls in inline form, for default and flex modes
* add example of custom select and checks to docs
* remove hidden and visible label variants since we cover that in the usage guidelines at the start and include hidden labels everywhere
* use property value instead of layout name
* apply to all labels
* add a visible label, space it out
* add id

Uses a local variable and some calc love to counteract the border-width (times 2) from the height of the select. Fixes #17194 and nullifies #19967.

- Remove margin-bottom override in favor of .mb-0 utility class
- Apply the input line-height styles to match
- Remove the min-height to match the input

Overrides the default width: 100% with an auto. Fixes #20752.

Only override input border-radius as part of .form-control to avoid bug with iOS Safari (alt fix for #20247) (#20695)

- Includes new class
- New docs to support it
- Rearranged older docs

- Add lighter gray text to disabled state for .form-check
- Separate radios and checkboxes example
- Clarify docs

- Move disabled radio and checkbox styles to Reboot
- Collapse .radio and .checkbox into single class, .form-check
- Collapse .radio-inline and .checkbox-inline into single class, .form-check-inline
- Require classes for sub-elements in both new classes

- Rather than use CSS hacks, let's avoid needing to hack anything
- Creates a new Reboot entry to simply reset the appear of the temporal inputs, thereby avoiding the problem entirely
- Less than ideal for conveying affordance on iOS, but given bugginess of the input itself, seems a decent tradeoff