Drop labels from the docs

diff --git a/docs/components.html b/docs/components.html
index 990f31ae6e94bb214572cc825d6cb660ec55e145..873bff63d9b10e6f812cdd911cf7f2a95d736294 100644 (file)
--- a/docs/components.html
+++ b/docs/components.html
@@ -90,7 +90,7 @@
           <li><a href="#navbar"><i class="glyphicon-chevron-right"></i> Navbar</a></li>
           <li><a href="#breadcrumbs"><i class="glyphicon-chevron-right"></i> Breadcrumbs</a></li>
           <li><a href="#pagination"><i class="glyphicon-chevron-right"></i> Pagination</a></li>
-          <li><a href="#labels-badges"><i class="glyphicon-chevron-right"></i> Labels and badges</a></li>
+          <li><a href="#badges"><i class="glyphicon-chevron-right"></i> Badges</a></li>
           <li><a href="#typography"><i class="glyphicon-chevron-right"></i> Typography</a></li>
           <li><a href="#thumbnails"><i class="glyphicon-chevron-right"></i> Thumbnails</a></li>
           <li><a href="#alerts"><i class="glyphicon-chevron-right"></i> Alerts</a></li>
@@ -327,7 +327,7 @@
           <p>Button groups can also function as radios, where only one button may be active, or checkboxes, where any number of buttons may be active. View <a href="./javascript.html#buttons">the JavaScript docs</a> for that.</p>
 
           <h4>Dropdowns in button groups</h4>
-          <p><span class="label label-info">Heads up!</span> Buttons with dropdowns must be individually wrapped in their own <code>.btn-group</code> within a <code>.btn-toolbar</code> for proper rendering.</p>
+          <p>Buttons with dropdowns must be individually wrapped in their own <code>.btn-group</code> within a <code>.btn-toolbar</code> for proper rendering.</p>
         </section>
 
 
@@ -1511,73 +1511,13 @@
 
 
 
-        <!-- Labels and badges
+        <!-- Badges
         ================================================== -->
-        <section id="labels-badges">
+        <section id="badges">
           <div class="page-header">
-            <h1>Labels and badges</h1>
+            <h1>Badges</h1>
           </div>
-          <h3>Labels</h3>
-          <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>
-              <tr>
-                <td>
-                  <span class="label label-inverse">Inverse</span>
-                </td>
-                <td>
-                  <code>&lt;span class="label label-inverse"&gt;Inverse&lt;/span&gt;</code>
-                </td>
-              </tr>
-            </tbody>
-          </table>
 
-          <h3>Badges</h3>
           <table class="table table-bordered table-striped">
             <thead>
               <tr>
@@ -1657,7 +1597,7 @@
           </table>
 
           <h3>Easily collapsible</h3>
-          <p>For easy implementation, labels and badges will simply collapse (via CSS's <code>:empty</code> selector) when no content exists within.</p>
+          <p>For easy implementation, badges will simply collapse (via CSS's <code>:empty</code> selector) when no content exists within.</p>
 
         </section>
 

diff --git a/docs/css.html b/docs/css.html
index d9262dc5750fd785555ed2a91720b1cfc0daab77..51fa3ee09451632cf2d3b0d0288d85cdf1481a6d 100644 (file)
--- a/docs/css.html
+++ b/docs/css.html
@@ -303,7 +303,7 @@
           </div>
           <pre class="prettyprint">&lt;em&gt;rendered as italicized text&lt;/em&gt;</pre>
 
-          <p><span class="label label-info">Heads up!</span> Feel free to use <code>&lt;b&gt;</code> and <code>&lt;i&gt;</code> in HTML5. <code>&lt;b&gt;</code> is meant to highlight words or phrases without conveying additional importance while <code>&lt;i&gt;</code> is mostly for voice, technical terms, etc.</p>
+          <p>Feel free to use <code>&lt;b&gt;</code> and <code>&lt;i&gt;</code> in HTML5. <code>&lt;b&gt;</code> is meant to highlight words or phrases without conveying additional importance while <code>&lt;i&gt;</code> is mostly for voice, technical terms, etc.</p>
 
           <h3>Emphasis classes</h3>
           <p>Convey meaning through color with a handful of emphasis utility classes.</p>
@@ -567,8 +567,8 @@
   &lt;dd&gt;...&lt;/dd&gt;
 &lt;/dl&gt;
 </pre>
+        <h5>Auto-truncating</h5>
         <p>
-          <span class="label label-info">Heads up!</span>
           Horizontal description lists will truncate terms that are too long to fit in the left column fix <code>text-overflow</code>. In narrower viewports, they will change to the default stacked layout.
         </p>
       </section>
@@ -601,7 +601,6 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
   &amp;lt;p&amp;gt;Sample text here...&amp;lt;/p&amp;gt;
 &lt;/pre&gt;
 </pre>
-          <p><span class="label label-info">Heads up!</span> Be sure to keep code within <code>&lt;pre&gt;</code> tags as close to the left as possible; it will render all tabs.</p>
           <p>You may optionally add the <code>.pre-scrollable</code> class which will set a max-height of 350px and provide a y-axis scrollbar.</p>
         </section>
 
@@ -1841,7 +1840,6 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
 &lt;a href="#" class="btn btn-large disabled"&gt;Link&lt;/a&gt;
 </pre>
           <p>
-            <span class="label label-info">Heads up!</span>
             We use <code>.disabled</code> as a utility class here, similar to the common <code>.active</code> class, so no prefix is required. Also, this class is only for aesthetic; you must use custom JavaScript to disable links here.
           </p>
 
@@ -1884,7 +1882,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
             <h1>Images</h1>
           </div>
 
-          <p>Add classes to an <code>&lt;img&gt;</code> element to easily style images in any project.</p>
+          <p>Add classes to an <code>&lt;img&gt;</code> element to easily style images in any project. Rounded corners are not available in IE8.</p>
           <div class="bs-docs-example bs-docs-example-images">
             <img data-src="holder.js/140x140" class="img-rounded">
             <img data-src="holder.js/140x140" class="img-circle">
@@ -1895,8 +1893,6 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
 &lt;img src="..." class="img-circle"&gt;
 &lt;img src="..." class="img-polaroid"&gt;
 </pre>
-          <p><span class="label label-info">Heads up!</span> <code>.img-rounded</code> and <code>.img-circle</code> do not work in IE8 due to lack of <code>border-radius</code> support.</p>
-
 
         </section>
 
@@ -2094,10 +2090,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
 &lt;i class="glyphicon-search"&gt;&lt;/i&gt;
 </pre>
           <p>Want to change the icon color? Just change the <code>color</code> of the parent element.</p>
-          <p>
-            <span class="label label-info">Heads up!</span>
-            When using beside strings of text, as in buttons or nav links, be sure to leave a space after the icon for proper spacing.
-          </p>
+          <p>When using beside strings of text, as in buttons or nav links, be sure to leave a space after the icon for proper spacing.</p>
 
 
           <hr class="bs-docs-separator">

diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache
index ad37836b06a336f8aa32c1367cac30f5e281803c..f9fbaf4cbb7afcd70ac3784b6962472a2cb2d803 100644 (file)
--- a/docs/templates/pages/components.mustache
+++ b/docs/templates/pages/components.mustache
@@ -22,7 +22,7 @@
           <li><a href="#navbar"><i class="glyphicon-chevron-right"></i> Navbar</a></li>
           <li><a href="#breadcrumbs"><i class="glyphicon-chevron-right"></i> Breadcrumbs</a></li>
           <li><a href="#pagination"><i class="glyphicon-chevron-right"></i> Pagination</a></li>
-          <li><a href="#labels-badges"><i class="glyphicon-chevron-right"></i> Labels and badges</a></li>
+          <li><a href="#badges"><i class="glyphicon-chevron-right"></i> Badges</a></li>
           <li><a href="#typography"><i class="glyphicon-chevron-right"></i> Typography</a></li>
           <li><a href="#thumbnails"><i class="glyphicon-chevron-right"></i> Thumbnails</a></li>
           <li><a href="#alerts"><i class="glyphicon-chevron-right"></i> Alerts</a></li>
@@ -259,7 +259,7 @@
           <p>Button groups can also function as radios, where only one button may be active, or checkboxes, where any number of buttons may be active. View <a href="./javascript.html#buttons">the JavaScript docs</a> for that.</p>
 
           <h4>Dropdowns in button groups</h4>
-          <p><span class="label label-info">Heads up!</span> Buttons with dropdowns must be individually wrapped in their own <code>.btn-group</code> within a <code>.btn-toolbar</code> for proper rendering.</p>
+          <p>Buttons with dropdowns must be individually wrapped in their own <code>.btn-group</code> within a <code>.btn-toolbar</code> for proper rendering.</p>
         </section>
 
 
@@ -1443,73 +1443,13 @@
 
 
 
-        <!-- Labels and badges
+        <!-- Badges
         ================================================== -->
-        <section id="labels-badges">
+        <section id="badges">
           <div class="page-header">
-            <h1>Labels and badges</h1>
+            <h1>Badges</h1>
           </div>
-          <h3>Labels</h3>
-          <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>
-              <tr>
-                <td>
-                  <span class="label label-inverse">Inverse</span>
-                </td>
-                <td>
-                  <code>&lt;span class="label label-inverse"&gt;Inverse&lt;/span&gt;</code>
-                </td>
-              </tr>
-            </tbody>
-          </table>
 
-          <h3>Badges</h3>
           <table class="table table-bordered table-striped">
             <thead>
               <tr>
@@ -1589,7 +1529,7 @@
           </table>
 
           <h3>Easily collapsible</h3>
-          <p>For easy implementation, labels and badges will simply collapse (via CSS's <code>:empty</code> selector) when no content exists within.</p>
+          <p>For easy implementation, badges will simply collapse (via CSS's <code>:empty</code> selector) when no content exists within.</p>
 
         </section>
 

diff --git a/docs/templates/pages/css.mustache b/docs/templates/pages/css.mustache
index e8727204f9dd72f73cd2c0f8c323ad87c971e9d5..27158c01f42ce8d3a3fe69276d86e8315eb199dd 100644 (file)
--- a/docs/templates/pages/css.mustache
+++ b/docs/templates/pages/css.mustache
@@ -240,7 +240,7 @@
           </div>
           <pre class="prettyprint">&lt;em&gt;rendered as italicized text&lt;/em&gt;</pre>
 
-          <p><span class="label label-info">Heads up!</span> Feel free to use <code>&lt;b&gt;</code> and <code>&lt;i&gt;</code> in HTML5. <code>&lt;b&gt;</code> is meant to highlight words or phrases without conveying additional importance while <code>&lt;i&gt;</code> is mostly for voice, technical terms, etc.</p>
+          <p>Feel free to use <code>&lt;b&gt;</code> and <code>&lt;i&gt;</code> in HTML5. <code>&lt;b&gt;</code> is meant to highlight words or phrases without conveying additional importance while <code>&lt;i&gt;</code> is mostly for voice, technical terms, etc.</p>
 
           <h3>Emphasis classes</h3>
           <p>Convey meaning through color with a handful of emphasis utility classes.</p>
@@ -507,8 +507,8 @@
   &lt;dd&gt;...&lt;/dd&gt;
 &lt;/dl&gt;
 </pre>
+        <h5>Auto-truncating</h5>
         <p>
-          <span class="label label-info">Heads up!</span>
           Horizontal description lists will truncate terms that are too long to fit in the left column fix <code>text-overflow</code>. In narrower viewports, they will change to the default stacked layout.
         </p>
       </section>
@@ -541,7 +541,6 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
   &amp;lt;p&amp;gt;Sample text here...&amp;lt;/p&amp;gt;
 &lt;/pre&gt;
 </pre>
-          <p><span class="label label-info">Heads up!</span> Be sure to keep code within <code>&lt;pre&gt;</code> tags as close to the left as possible; it will render all tabs.</p>
           <p>You may optionally add the <code>.pre-scrollable</code> class which will set a max-height of 350px and provide a y-axis scrollbar.</p>
         </section>
 
@@ -1781,7 +1780,6 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
 &lt;a href="#" class="btn btn-large disabled"&gt;Link&lt;/a&gt;
 </pre>
           <p>
-            <span class="label label-info">Heads up!</span>
             We use <code>.disabled</code> as a utility class here, similar to the common <code>.active</code> class, so no prefix is required. Also, this class is only for aesthetic; you must use custom JavaScript to disable links here.
           </p>
 
@@ -1824,7 +1822,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
             <h1>Images</h1>
           </div>
 
-          <p>Add classes to an <code>&lt;img&gt;</code> element to easily style images in any project.</p>
+          <p>Add classes to an <code>&lt;img&gt;</code> element to easily style images in any project. Rounded corners are not available in IE8.</p>
           <div class="bs-docs-example bs-docs-example-images">
             <img data-src="holder.js/140x140" class="img-rounded">
             <img data-src="holder.js/140x140" class="img-circle">
@@ -1835,8 +1833,6 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
 &lt;img src="..." class="img-circle"&gt;
 &lt;img src="..." class="img-polaroid"&gt;
 </pre>
-          <p><span class="label label-info">Heads up!</span> <code>.img-rounded</code> and <code>.img-circle</code> do not work in IE8 due to lack of <code>border-radius</code> support.</p>
-
 
         </section>
 
@@ -2034,10 +2030,7 @@ For example, &lt;code&gt;&lt;section&gt;&lt;/code&gt; should be wrapped as inlin
 &lt;i class="glyphicon-search"&gt;&lt;/i&gt;
 </pre>
           <p>Want to change the icon color? Just change the <code>color</code> of the parent element.</p>
-          <p>
-            <span class="label label-info">Heads up!</span>
-            When using beside strings of text, as in buttons or nav links, be sure to leave a space after the icon for proper spacing.
-          </p>
+          <p>When using beside strings of text, as in buttons or nav links, be sure to leave a space after the icon for proper spacing.</p>
 
 
           <hr class="bs-docs-separator">