* Extra position utilities
Given that there are utilities for the *position* property, it seems logic to have utilities for the *top*, *left*, *bottom* and *right* propertires.
* Update extra position utilities
* add default position values map
* tweak examples
* add real life examples
* fix double colon
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* Add default parameters to each border radius mixin
* Add border radius changes to migration guide
Co-authored-by: Jeremy Jackson <jeremy@librarymarket.com>
* Support 'null' and drop `none` with multiple args
* Output a warning when use 'none' with multiple arguments
* Add migration note
* Update migration.md
Co-authored-by: Mark Otto <markd.otto@gmail.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* feat(buttons): ensure to increase contrasts on hover/active
* Update _buttons.scss
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
* Add padding to badges
The current badges are very tightly padded, and because the top and bottom padding are the same, and aligned to the baseline, this makes badges with descenders (e.g. the "g" in "Danger") look uncomfortably close to the bottom. Adding more ample padding masks this a bit.
An alternative would be to have separate top and bottom padding, with the bottom one slightly larger than the top - but conversely, that then makes badges that contain no text with descenders, and particularly badges that contain all uppercase characters, look too bottom-heavy.
Also adding some left/right extra padding, as currently the pill badges look uncomfortably tight on the sides due to the rounding.
Moves from 1.25em to 1em to better support custom font-size-base values. Most common would probably be .875rem (14px) and current sizing garbles that into 1.09-ish, thus causing the rendering issues in #31269.
Co-authored-by: Martijn Cuppens <martijn.cuppens@gmail.com>
* sr-only -> visually-hidden cleanup
It seems the old screen-readers.md file was left behind, and forgot to rename the mixin
* Fix broken mixins for visually-hidden
New default behavior for scroll anchoring (rolled out in Chrome 84?) leads to unsightly/odd accordion interactions - see #31341
This rule suppresses this new behavior and reverts back to the old way.
See https://drafts.csswg.org/css-scroll-anchoring/
* feat(buttons): easier disabled state customization
* docs(migration): mention new arguments for disabled state in button-variant()
* Update migration.md
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
Replaces #30498 by adding four new null default variables for .nav-link. Doesn't carry over font-style from the original PR though since that's rarely used, at least by default Bootstrap. Nullifies all values from that PR, too, since we count on some basic inheritance here and don't need color by default.
"screen readers" is quite reductive, as there are other assistive technologies. content hidden this way is even announced by things like Alexa/Siri etc, so it's not so much just "screen readers".
in the long run, we may even consider changing the actual classnames (maybe `.visually-hidden` / `.visually-hidden-focusable`, though admittedly that's a bit verbose).
also includes a tiny tweak to layout.md to generalise the note about using `.sr-only`
* Rename `sr-only`/`sr-only-focusable`
To be more representative of the fact that these are not necessarily "screen reader" specific, but actually apply to assistive technologies in general (and also things like Alexa/Siri/etc). Goes hand-in-hand with #31133
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* v5: Add role=button cursor in Reboot
Ports the changes from #30562 made in v4.5 and adds them to v5. This replaces #30563 which sought to add this to the utility API, but the v4 PR shifted to implement an accessible solution vs a lone utility.
* Update reboot.md
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
- The `media-breakpoint-down()` uses the breakpoint itself instead of the next breakpoint. Use `media-breakpoint-down(lg)` instead of `media-breakpoint-down(md)` to target viewports smaller than the `lg` breakpoint.
- The `media-breakpoint-between()` mixin's second parameter also uses the breakpoint itself instead of the next breakpoint. Use `media-between(sm, lg)` instead of `media-breakpoint-between(sm, md)` to target viewports between the `sm` and `lg` breakpoints.
* v5: Redo blockquote attributions
- Renames -small-* variables to -footer-*
- Updates blockquote demos with attribution to place it outside the blockquote with a figure wrapper
* Updated class name
* docs(examples): refactor blockquotes in masonry example
Co-authored-by: Gaël Poupard <gael.poupard@orange.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Mark Otto