From acdffe696cf29f51c659a18eeca304512ff47048 Mon Sep 17 00:00:00 2001
From: Mark Otto <otto@github.com>
Date: Sun, 17 Feb 2013 22:20:49 -0800
Subject: Bring back the label, make it scale somewhat with the font-size of
 the parent using percentages and ems

---
 docs/assets/css/bootstrap.css | 52 ++++++++++++++++++++++++++++
 docs/components.html          | 79 +++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 131 insertions(+)

(limited to 'docs')

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index db65570fc..cb8482a9f 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -4263,6 +4263,58 @@ a.thumbnail:focus {
   list-style: none;
 }
 
+.label {
+  padding: .25em .6em;
+  font-size: 75%;
+  font-weight: 500;
+  line-height: 1;
+  color: #fff;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: middle;
+  background-color: #999999;
+  border-radius: .25em;
+}
+
+a.label:hover,
+a.label:focus {
+  color: #fff;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.label-danger {
+  background-color: #d9534f;
+}
+
+.label-danger[href] {
+  background-color: #c9302c;
+}
+
+.label-warning {
+  background-color: #f0ad4e;
+}
+
+.label-warning[href] {
+  background-color: #ec971f;
+}
+
+.label-success {
+  background-color: #5cb85c;
+}
+
+.label-success[href] {
+  background-color: #449d44;
+}
+
+.label-info {
+  background-color: #5bc0de;
+}
+
+.label-info[href] {
+  background-color: #31b0d5;
+}
+
 .badge {
   display: inline-block;
   min-width: 10px;
diff --git a/docs/components.html b/docs/components.html
index 53b4a7e08..f1b45159b 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -28,6 +28,7 @@ title: Components
           <li><a href="#navbar"><i class="glyphicon glyphicon-chevron-right"></i> Navbar</a></li>
           <li><a href="#breadcrumbs"><i class="glyphicon glyphicon-chevron-right"></i> Breadcrumbs</a></li>
           <li><a href="#pagination"><i class="glyphicon glyphicon-chevron-right"></i> Pagination</a></li>
+          <li><a href="#labels"><i class="glyphicon glyphicon-chevron-right"></i> Labels</a></li>
           <li><a href="#badges"><i class="glyphicon glyphicon-chevron-right"></i> Badges</a></li>
           <li><a href="#typography"><i class="glyphicon glyphicon-chevron-right"></i> Typography</a></li>
           <li><a href="#thumbnails"><i class="glyphicon glyphicon-chevron-right"></i> Thumbnails</a></li>
@@ -1274,6 +1275,84 @@ title: Components
 
 
 
+        <!-- Labels
+        ================================================== -->
+        <section id="counters">
+          <div class="page-header">
+            <h1>Labels</h1>
+          </div>
+          <p class="lead"></p>
+
+          <h3>Example</h3>
+          <div class="bs-docs-example">
+            <h1>Example heading <span class="label">New</span></h1>
+            <h2>Example heading <span class="label">New</span></h2>
+            <h3>Example heading <span class="label">New</span></h3>
+            <h4>Example heading <span class="label">New</span></h4>
+            <h5>Example heading <span class="label">New</span></h5>
+            <h6>Example heading <span class="label">New</span></h6>
+          </div>
+{% highlight html linenos %}
+<h3>Example heading <span class="label">New</span></h3>
+{% endhighlight %}
+
+          <h3>Available variations</h3>
+          <p>Add any of the below mentioned modifier classes to change the appearance of a label.</p>
+          <table class="table table-bordered table-striped">
+            <thead>
+              <tr>
+                <th>Labels</th>
+                <th>Markup</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr>
+                <td>
+                  <span class="label">Default</span>
+                </td>
+                <td>
+                  <code>&lt;span class="label"&gt;Default&lt;/span&gt;</code>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <span class="label label-success">Success</span>
+                </td>
+                <td>
+                  <code>&lt;span class="label label-success"&gt;Success&lt;/span&gt;</code>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <span class="label label-warning">Warning</span>
+                </td>
+                <td>
+                  <code>&lt;span class="label label-warning"&gt;Warning&lt;/span&gt;</code>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <span class="label label-danger">Danger</span>
+                </td>
+                <td>
+                  <code>&lt;span class="label label-danger"&gt;Danger&lt;/span&gt;</code>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <span class="label label-info">Info</span>
+                </td>
+                <td>
+                  <code>&lt;span class="label label-info"&gt;Info&lt;/span&gt;</code>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+
+        </section>
+
+
+
         <!-- Badges
         ================================================== -->
         <section id="badges">
-- 
cgit v1.2.3