These were using `z-index: 2` to "Place active items above their
siblings for proper border styling". However, using `z-index: 1` is
sufficient for accomplishing that goal.
In input-group, there were also three `z-index: 3` rules for the
hover/focus/active states. I reduced these to `z-index: 2` since they
just needed to be "one more than normal" (i.e. one more than what is now
`z-index: 1` after my changes).
These changes can be verified by viewing the documentation pages for
Button group, Input group, List group, and Pagination before and after
this commit and observing that the active elements are still "above"
their siblings, so their borders look correct.
* Update the form focus mixin to use a manual `$enable-shadows` check so we can always ensure a focus state for accessibility and consistency
* - Add new `$input-btn-focus-width` and `$input-btn-focus-color` variables.
- Replace separate `$btn-focus-box-shadow` and `$input-focus-box-shadow`
variables with unified `$input-btn-focus-box-shadow` to match our
combined variables approach elsewhere.
* Put new focus width var to use in buttons mixins
* use new button input-box shadow var
* Add a new mixin for quickly adding linear gradient to components when $enable-gradients is set to true
* use correct var
* fix focus shadows in button mixins
* Add opt-in gradients to alerts, buttons, carousel, custom radios and checkboxes, custom file input, and dropdown items
* Generate .bg-gradient- utilities
* add headings to colors page and document bg-gradient utils
* update the button color for active status, check with yiq as it's done for basic state and hover state
IE10 and IE11 do not properly support the use of margin-auto on flex parents with a justify-content value other than flex-start. This PR removes the examples showcasing those two classes at play together in favor of simpler ones with _just_ the margin-auto utilities.
More details can be found at https://stackoverflow.com/a/37535548, which has been linked to from the docs as well.
Closes#24319 and closes#24413.
This document contains the word JavaScript everywhere apart from in one place where it's abbreviated to JS. This just makes sure it's written as JavaScript consistently across the page.
* Refer to utility classes uses. Add Printing section
refer to (not navbar) classes used for newbies
navbars don't print, so add example of a print-only alternative
* typos, add links
typo in {% example %}
add links to component pages
* grammar
* Add a dropdown with divider to the main example
* change id name to stop travis error
I assume id="camelCase" is the standard for id names, rather than the clearly superior id="underscore_words"
* review changes
still like to emphasise the foreign utility classes in the main example
bg-light's name is self explanatory (so its obvious where to look it up), but mr-sm-2's name isn't at first
* review changes
* grammar
* .fixed-top/bottom don't reserve space on the screen
... as they are position:fixed.
better wording welcome
* copyediting
- rewrite utils line and link to the utils pages
- restore the paragraphs to the placement section
- fix formatting and grammar
* fixes migration forms guides
* removes container from Horizontal form
* adds col-form-label sizes on form docs
* removes .form-control-label from forms.scss
* add note to migration
Gijs Boddeus