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 {
.bs-docs-sidenav {
width: 170px;
}
+ .bs-docs-sidenav.affix-bottom {
+ position: absolute;
+ top: auto;
+ bottom: 270px;
+ }
}
/* Tablets/desktops and up */
<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>
</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>
<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>
</pre>
- <hr class="bs-docs-separator">
-
-
<h2 id="blockquotes">Blockquotes</h2>
<p>For quoting blocks of content from another source within your document.</p>
</pre>
- <hr class="bs-docs-separator">
-
-
<!-- Lists -->
<h2 id="lists">Lists</h2>
</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>
</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">
</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">
</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>
</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>
</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>
</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>
<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">
<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>
<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">
<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>
<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>
<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>
</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>
<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>
</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>
</pre>
- <hr class="bs-docs-separator">
-
-
<!-- Lists -->
<h2 id="lists">Lists</h2>
</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>
</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">
</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">
</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>
</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>
</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>
</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>
<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">
<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>
<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">
<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>
<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>
projects / thirdparty / bootstrap.git / commitdiff
