diff options
author | Mark Otto <otto@github.com> | 2014-03-05 04:55:15 +0400 |
---|---|---|
committer | Mark Otto <otto@github.com> | 2014-03-05 04:55:15 +0400 |
commit | 24de9b099438c09236b2066333744e3995cd88ab (patch) | |
tree | c1f5213cf22288df74f4bf8d74e86b0656096ff3 /docs/components.html | |
parent | 13ed379767d19040c98fc23bd9b5cdb84e66474b (diff) |
Fixes #12848: Account for and document progress bars at 0-3%
Diffstat (limited to 'docs/components.html')
-rw-r--r-- | docs/components.html | 28 |
1 files changed, 28 insertions, 0 deletions
diff --git a/docs/components.html b/docs/components.html index efa8a05191..5780c4a310 100644 --- a/docs/components.html +++ b/docs/components.html @@ -2280,6 +2280,34 @@ body { padding-bottom: 70px; } </div> {% endhighlight %} + <h3 id="progress-low-percentages">Low percentages</h3> + <p>Progress bars representing low single digit percentages, as well as 0%, include a <code>min-width: 20px;</code> for legibility.</p> + <div class="bs-example"> + <div class="progress"> + <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"> + 0% + </div> + </div> + <div class="progress"> + <div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="width: 2%;"> + 2% + </div> + </div> + </div> +{% highlight html %} +<div class="progress"> + <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"> + 0% + </div> +</div> +<div class="progress"> + <div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="width: 2%;"> + 2% + </div> +</div> +{% endhighlight %} + + <h3 id="progress-alternatives">Contextual alternatives</h3> <p>Progress bars use some of the same button and alert classes for consistent styles.</p> <div class="bs-example"> |