Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/twbs/bootstrap.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
path: root/docs
diff options
context:
space:
mode:
authorMark Otto <otto@github.com>2012-12-20 09:29:57 +0400
committerMark Otto <otto@github.com>2012-12-20 09:29:57 +0400
commit2011a0d50f717c95b706e10ac5e9e0f964c972a9 (patch)
treed5cb22b75938dc38d9708045291463425cbcc596 /docs
parentc6cc1b1a1d401e30e2cb7df853461dfc78134f7f (diff)
Drop labels from the docs
Diffstat (limited to 'docs')
-rw-r--r--docs/components.html72
-rw-r--r--docs/css.html15
-rw-r--r--docs/templates/pages/components.mustache72
-rw-r--r--docs/templates/pages/css.mustache15
4 files changed, 20 insertions, 154 deletions
diff --git a/docs/components.html b/docs/components.html
index 990f31ae6e..873bff63d9 100644
--- 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 d9262dc575..51fa3ee094 100644
--- 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 ad37836b06..f9fbaf4cbb 100644
--- 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 e8727204f9..27158c01f4 100644
--- 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">