From 24de9b099438c09236b2066333744e3995cd88ab Mon Sep 17 00:00:00 2001
From: Mark Otto <otto@github.com>
Date: Tue, 4 Mar 2014 16:55:15 -0800
Subject: Fixes #12848: Account for and document progress bars at 0-3%

---
 docs/components.html | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)

(limited to 'docs/components.html')

diff --git a/docs/components.html b/docs/components.html
index efa8a0519..5780c4a31 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">
-- 
cgit v1.2.3