mirror of
https://github.com/twbs/bootstrap.git
synced 2025-01-17 09:52:29 +01:00
streamline css docs
This commit is contained in:
Mark Otto
parent
2398245e17
commit
267d3e7ed7
@ -165,12 +165,6 @@ section > ul li {
|
||||
position: static;
|
||||
top: 0;
|
||||
}
|
||||
.bs-docs-sidenav.affix-bottom {
|
||||
position: absolute;
|
||||
top: auto;
|
||||
bottom: 270px;
|
||||
}
|
||||
|
||||
|
||||
/* Chevrons within each link */
|
||||
.bs-docs-sidenav .glyphicon-chevron-right {
|
||||
@ -474,6 +468,11 @@ section > ul li {
|
||||
.bs-docs-sidenav {
|
||||
width: 170px;
|
||||
}
|
||||
.bs-docs-sidenav.affix-bottom {
|
||||
position: absolute;
|
||||
top: auto;
|
||||
bottom: 270px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablets/desktops and up */
|
||||
|
||||
@ -178,9 +178,6 @@
|
||||
<p>The typographic scale is based on two LESS variables in <strong>variables.less</strong>: <code>@font-size-base</code> and <code>@line-height-base</code>. The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.</p>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="emphasis">Emphasis</h2>
|
||||
<p>Make use of HTML's default emphasis tags with lightweight styles.</p>
|
||||
|
||||
@ -240,9 +237,6 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="abbreviations">Abbreviations</h2>
|
||||
<p>Stylized implementation of HTML's <code><abbr></code> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations with a <code>title</code> attribute have a light dotted bottom border and a help cursor on hover, providing additional context on hover.</p>
|
||||
|
||||
@ -261,9 +255,6 @@
|
||||
<pre class="prettyprint"><abbr title="HyperText Markup Language" class="initialism">HTML</abbr></pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="addresses">Addresses</h2>
|
||||
<p>Present contact information for the nearest ancestor or the entire body of work.</p>
|
||||
|
||||
@ -296,9 +287,6 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="blockquotes">Blockquotes</h2>
|
||||
<p>For quoting blocks of content from another source within your document.</p>
|
||||
|
||||
@ -348,9 +336,6 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<!-- Lists -->
|
||||
<h2 id="lists">Lists</h2>
|
||||
|
||||
@ -671,9 +656,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Optional classes</h2>
|
||||
<p>Add any of the following classes to the <code>.table</code> base class.</p>
|
||||
|
||||
@ -840,9 +822,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Optional row classes</h2>
|
||||
<p>Use contextual classes to color table rows.</p>
|
||||
<table class="table table-bordered table-striped">
|
||||
@ -933,9 +912,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Supported table markup</h2>
|
||||
<p>List of supported table HTML elements and how they should be used.</p>
|
||||
<table class="table table-bordered table-striped">
|
||||
@ -1072,9 +1048,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="forms-layouts">Optional layouts</h2>
|
||||
<p>Included with Bootstrap are optional form layouts for common use cases.</p>
|
||||
|
||||
@ -1163,9 +1136,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="forms-controls">Supported form controls</h2>
|
||||
<p>Examples of standard form controls supported in an example form layout.</p>
|
||||
|
||||
@ -1297,9 +1267,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="forms-extending">Extending form controls</h2>
|
||||
<p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p>
|
||||
|
||||
@ -1616,9 +1583,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Form control states</h2>
|
||||
<p>Provide feedback to users or visitors with basic feedback states on form controls and labels.</p>
|
||||
|
||||
@ -2100,9 +2064,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<p><a href="http://glyphicons.com/">Glyphicons</a> Halflings are normally not available for free, but an arrangement between Bootstrap and the Glyphicons creator have made this possible at no cost to you as developers. As a thank you, we ask you to include an optional link back to <a href="http://glyphicons.com/">Glyphicons</a> whenever practical.</p>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>How to use</h2>
|
||||
<p>Add the appropriate class to any inline element. All icon classes are prefixed with <code>glyphicon-</code> for easy styling. To use, place the following code just about anywhere:</p>
|
||||
<pre class="prettyprint linenums">
|
||||
@ -2112,9 +2073,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<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">
|
||||
|
||||
|
||||
<h2>Icon examples</h2>
|
||||
<p>Use them in buttons, button groups for a toolbar, navigation, or prepended form inputs.</p>
|
||||
|
||||
@ -2190,14 +2148,12 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
|
||||
<h4>Navigation</h4>
|
||||
<div class="bs-docs-example">
|
||||
<div class="well" style="padding: 8px 0; margin-bottom: 0;">
|
||||
<ul class="nav nav-list">
|
||||
<li class="active"><a href="#"><i class="glyphicon-home icon-white"></i> Home</a></li>
|
||||
<li><a href="#"><i class="glyphicon-book"></i> Library</a></li>
|
||||
<li><a href="#"><i class="glyphicon-pencil"></i> Applications</a></li>
|
||||
<li><a href="#"><i class="i"></i> Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<ul class="nav nav-list">
|
||||
<li class="active"><a href="#"><i class="glyphicon-home icon-white"></i> Home</a></li>
|
||||
<li><a href="#"><i class="glyphicon-book"></i> Library</a></li>
|
||||
<li><a href="#"><i class="glyphicon-pencil"></i> Applications</a></li>
|
||||
<li><a href="#"><i class="i"></i> Misc</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<ul class="nav nav-list">
|
||||
@ -2213,8 +2169,9 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<div class="control-group">
|
||||
<label class="control-label" for="inputIcon">Email address</label>
|
||||
<div class="controls">
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="glyphicon-envelope"></i></span><input class="span2" id="inputIcon" type="text">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon"><i class="glyphicon-envelope"></i></span>
|
||||
<input class="span2" id="inputIcon" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -2223,8 +2180,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<div class="control-group">
|
||||
<label class="control-label" for="inputIcon">Email address</label>
|
||||
<div class="controls">
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="glyphicon-envelope"></i></span>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon"><i class="glyphicon-envelope"></i></span>
|
||||
<input class="span2" id="inputIcon" type="text">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
65
docs/templates/pages/css.mustache
vendored
65
docs/templates/pages/css.mustache
vendored
@ -114,9 +114,6 @@
|
||||
<p>The typographic scale is based on two LESS variables in <strong>variables.less</strong>: <code>@font-size-base</code> and <code>@line-height-base</code>. The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.</p>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
{{! Emphasis }}
|
||||
<h2 id="emphasis">Emphasis</h2>
|
||||
<p>Make use of HTML's default emphasis tags with lightweight styles.</p>
|
||||
@ -177,9 +174,6 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
{{! Abbreviations }}
|
||||
<h2 id="abbreviations">Abbreviations</h2>
|
||||
<p>Stylized implementation of HTML's <code><abbr></code> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations with a <code>title</code> attribute have a light dotted bottom border and a help cursor on hover, providing additional context on hover.</p>
|
||||
@ -199,9 +193,6 @@
|
||||
<pre class="prettyprint"><abbr title="HyperText Markup Language" class="initialism">HTML</abbr></pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
{{! Addresses }}
|
||||
<h2 id="addresses">Addresses</h2>
|
||||
<p>Present contact information for the nearest ancestor or the entire body of work.</p>
|
||||
@ -235,9 +226,6 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
{{! Blockquotes }}
|
||||
<h2 id="blockquotes">Blockquotes</h2>
|
||||
<p>For quoting blocks of content from another source within your document.</p>
|
||||
@ -288,9 +276,6 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<!-- Lists -->
|
||||
<h2 id="lists">Lists</h2>
|
||||
|
||||
@ -611,9 +596,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Optional classes</h2>
|
||||
<p>Add any of the following classes to the <code>.table</code> base class.</p>
|
||||
|
||||
@ -780,9 +762,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Optional row classes</h2>
|
||||
<p>Use contextual classes to color table rows.</p>
|
||||
<table class="table table-bordered table-striped">
|
||||
@ -873,9 +852,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Supported table markup</h2>
|
||||
<p>List of supported table HTML elements and how they should be used.</p>
|
||||
<table class="table table-bordered table-striped">
|
||||
@ -1012,9 +988,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="forms-layouts">Optional layouts</h2>
|
||||
<p>Included with Bootstrap are optional form layouts for common use cases.</p>
|
||||
|
||||
@ -1103,9 +1076,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="forms-controls">Supported form controls</h2>
|
||||
<p>Examples of standard form controls supported in an example form layout.</p>
|
||||
|
||||
@ -1237,9 +1207,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2 id="forms-extending">Extending form controls</h2>
|
||||
<p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p>
|
||||
|
||||
@ -1556,9 +1523,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Form control states</h2>
|
||||
<p>Provide feedback to users or visitors with basic feedback states on form controls and labels.</p>
|
||||
|
||||
@ -2040,9 +2004,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<p><a href="http://glyphicons.com/">Glyphicons</a> Halflings are normally not available for free, but an arrangement between Bootstrap and the Glyphicons creator have made this possible at no cost to you as developers. As a thank you, we ask you to include an optional link back to <a href="http://glyphicons.com/">Glyphicons</a> whenever practical.</p>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>How to use</h2>
|
||||
<p>Add the appropriate class to any inline element. All icon classes are prefixed with <code>glyphicon-</code> for easy styling. To use, place the following code just about anywhere:</p>
|
||||
<pre class="prettyprint linenums">
|
||||
@ -2052,9 +2013,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<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">
|
||||
|
||||
|
||||
<h2>Icon examples</h2>
|
||||
<p>Use them in buttons, button groups for a toolbar, navigation, or prepended form inputs.</p>
|
||||
|
||||
@ -2130,14 +2088,12 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
|
||||
<h4>Navigation</h4>
|
||||
<div class="bs-docs-example">
|
||||
<div class="well" style="padding: 8px 0; margin-bottom: 0;">
|
||||
<ul class="nav nav-list">
|
||||
<li class="active"><a href="#"><i class="glyphicon-home icon-white"></i> Home</a></li>
|
||||
<li><a href="#"><i class="glyphicon-book"></i> Library</a></li>
|
||||
<li><a href="#"><i class="glyphicon-pencil"></i> Applications</a></li>
|
||||
<li><a href="#"><i class="i"></i> Misc</a></li>
|
||||
</ul>
|
||||
</div>{{! /well }}
|
||||
<ul class="nav nav-list">
|
||||
<li class="active"><a href="#"><i class="glyphicon-home icon-white"></i> Home</a></li>
|
||||
<li><a href="#"><i class="glyphicon-book"></i> Library</a></li>
|
||||
<li><a href="#"><i class="glyphicon-pencil"></i> Applications</a></li>
|
||||
<li><a href="#"><i class="i"></i> Misc</a></li>
|
||||
</ul>
|
||||
</div>{{! /bs-docs-example }}
|
||||
<pre class="prettyprint linenums">
|
||||
<ul class="nav nav-list">
|
||||
@ -2153,8 +2109,9 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<div class="control-group">
|
||||
<label class="control-label" for="inputIcon">Email address</label>
|
||||
<div class="controls">
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="glyphicon-envelope"></i></span><input class="span2" id="inputIcon" type="text">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon"><i class="glyphicon-envelope"></i></span>
|
||||
<input class="span2" id="inputIcon" type="text">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -2163,8 +2120,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<div class="control-group">
|
||||
<label class="control-label" for="inputIcon">Email address</label>
|
||||
<div class="controls">
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="glyphicon-envelope"></i></span>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon"><i class="glyphicon-envelope"></i></span>
|
||||
<input class="span2" id="inputIcon" type="text">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user