https://github.com/twbs/bootstrap
Revision 26a3ef1bcb147d3a3b79610f674298e6fdfb11fe authored by Patrick H. Lauke on 29 November 2022, 07:07:48 UTC, committed by GitHub on 29 November 2022, 07:07:48 UTC
* Rework progress bar markup and styles

Logically moves the various `role` and `aria-` attributes to the `.progress` element itself, leaving the `.progress-bar` to be used purely for the visual presentation. This fixes the problem #36736 that in certain browser/AT combinations, zero-value/zero-width progress bars are completely ignored and not announced.

For multiple/stacked progress bars, this PR introduces a new wrapper and class `.progress-stacked`, to accommodate for the fact that with the more logical structure above, we need full `.progress` elements with child `.progress-bar` elements, and can't get away with the fudge we had before of having a single `.progress` with multiple `.progress-bar`s.

Note that the old markup structures still work with this change, so this could be considered a non-breaking change - though one we definitely want to highlight as it's more accessible (as it now guarantees that zero-value/zero-width progress bars, whether on their own or as part of a multi/stacked bar, are actually announced)

* Add a note about progress bar change in migration guide

* Add notes with old markup examples and explanation

* Fix bundlewatch

* Update site/content/docs/5.2/components/progress.md

Co-authored-by: Julien Déramond <julien.deramond@orange.com>

* Reintroduce deleted styles

Turns out they're needed for correct positioning of text inside progress bar

* Move changes in markup to Migrationg guide, link to that from top of progress page, rewrite some content

* Fix typo in callout

* Clarify "Sizing" section

* Remove redundant "now"

Co-authored-by: Julien Déramond <julien.deramond@orange.com>
Co-authored-by: Julien Déramond <juderamond@gmail.com>
Co-authored-by: Mark Otto <markdotto@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
1 parent 019a977
History
Tip revision: 26a3ef1bcb147d3a3b79610f674298e6fdfb11fe authored by Patrick H. Lauke on 29 November 2022, 07:07:48 UTC
Rework progress bar markup and styles (#36831)
Tip revision: 26a3ef1
File Mode Size
.github
build
dist
js
nuget
scss
site
.babelrc.js -rw-r--r-- 162 bytes
.browserslistrc -rw-r--r-- 175 bytes
.bundlewatch.config.json -rw-r--r-- 1.3 KB
.cspell.json -rw-r--r-- 2.0 KB
.editorconfig -rw-r--r-- 167 bytes
.eslintignore -rw-r--r-- 111 bytes
.eslintrc.json -rw-r--r-- 1.3 KB
.gitattributes -rw-r--r-- 177 bytes
.gitignore -rw-r--r-- 442 bytes
.stylelintignore -rw-r--r-- 55 bytes
.stylelintrc -rw-r--r-- 637 bytes
CODE_OF_CONDUCT.md -rw-r--r-- 5.4 KB
LICENSE -rw-r--r-- 1.1 KB
README.md -rw-r--r-- 13.3 KB
SECURITY.md -rw-r--r-- 471 bytes
composer.json -rw-r--r-- 667 bytes
config.yml -rw-r--r-- 3.6 KB
package-lock.json -rw-r--r-- 698.9 KB
package.js -rw-r--r-- 484 bytes
package.json -rw-r--r-- 9.1 KB

README.md

back to top