From 7bffd6ea8d073f1c8fa2209ef2864227f7c5f213 Mon Sep 17 00:00:00 2001 From: Louis-Maxime Piton Date: Tue, 14 Feb 2023 03:38:21 +0100 Subject: [PATCH] Docs: Progress fix + proposal (#38014) * Fix + proposal * fix(review) --------- Co-authored-by: Patrick H. Lauke --- site/content/docs/5.3/components/progress.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/site/content/docs/5.3/components/progress.md b/site/content/docs/5.3/components/progress.md index ea9e3d2d27..73f1315897 100644 --- a/site/content/docs/5.3/components/progress.md +++ b/site/content/docs/5.3/components/progress.md @@ -15,7 +15,7 @@ toc: true Progress components are built with two HTML elements, some CSS to set the width, and a few attributes. We don't use [the HTML5 `` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress), ensuring you can stack progress bars, animate them, and place text labels over them. - We use the `.progress` as a wrapper to indicate the max value of the progress bar. -- The `.progress` wrapper also requires a `role="progress"` and `aria` attributes to make it accessible, including an accessible name (using `aria-label`, `aria-labelledby`, or similar). +- The `.progress` wrapper also requires a `role="progressbar"` and `aria` attributes to make it accessible, including an accessible name (using `aria-label`, `aria-labelledby`, or similar). - We use the inner `.progress-bar` purely for the visual bar and label. - The `.progress-bar` requires an inline style, utility class, or custom CSS to set its width. - We provide a special `.progress-stacked` class to create multiple/stacked progress bars. @@ -57,7 +57,7 @@ Bootstrap provides a handful of [utilities for setting width]({{< docsref "/util You only set a `height` value on the `.progress` container, so if you change that value, the inner `.progress-bar` will automatically resize accordingly. {{< example >}} -
+
-- 2.47.2