Commit 34070af4 authored by kostyatretyak's avatar kostyatretyak

Merge branch 'master' of https://github.com/twbs/bootstrap into correction

parents 6145cc02 5fdd9179
...@@ -123,7 +123,6 @@ Keep track of development and community news. ...@@ -123,7 +123,6 @@ Keep track of development and community news.
* Follow [@twbootstrap on Twitter](http://twitter.com/twbootstrap). * Follow [@twbootstrap on Twitter](http://twitter.com/twbootstrap).
* Read and subscribe to [The Official Bootstrap Blog](http://blog.getbootstrap.com). * Read and subscribe to [The Official Bootstrap Blog](http://blog.getbootstrap.com).
* Have a question that's not a feature request or bug report? [Ask on the mailing list.](http://groups.google.com/group/twitter-bootstrap)
* Chat with fellow Bootstrappers in IRC. On the `irc.freenode.net` server, in the `##twitter-bootstrap` channel. * Chat with fellow Bootstrappers in IRC. On the `irc.freenode.net` server, in the `##twitter-bootstrap` channel.
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
================================================== --> ================================================== -->
<!-- Placed at the end of the document so the pages load faster --> <!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="{{ page.base_url }}dist/js/bootstrap.js"></script> <script src="{{ page.base_url }}dist/js/bootstrap.min.js"></script>
<script src="{{ page.base_url }}docs-assets/js/holder.js"></script> <script src="{{ page.base_url }}docs-assets/js/holder.js"></script>
......
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content=""> <meta name="description" content="Bootstrap, a sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.">
<meta name="author" content=""> <meta name="keywords" content="HTML, CSS, JS, JavaScript, framework, bootstrap, front-end, frontend, web development">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contibutors">
<title> <title>
{% if page.title == "Bootstrap" %} {% if page.title == "Bootstrap" %}
......
...@@ -121,6 +121,7 @@ ...@@ -121,6 +121,7 @@
<li><a href="#list-group-basic">Basic example</a></li> <li><a href="#list-group-basic">Basic example</a></li>
<li><a href="#list-group-badges">Badges</a></li> <li><a href="#list-group-badges">Badges</a></li>
<li><a href="#list-group-linked">Linked items</a></li> <li><a href="#list-group-linked">Linked items</a></li>
<li><a href="#list-group-contextual-classes">Contextual classes</a></li>
<li><a href="#list-group-custom-content">Custom content</a></li> <li><a href="#list-group-custom-content">Custom content</a></li>
</ul> </ul>
</li> </li>
......
...@@ -37,7 +37,14 @@ ...@@ -37,7 +37,14 @@
<li><a href="#type-lists">Lists</a></li> <li><a href="#type-lists">Lists</a></li>
</ul> </ul>
</li> </li>
<li><a href="#code">Code</a></li> <li>
<a href="#code">Code</a>
<ul class="nav">
<li><a href="#code-inline">Inline code</a></li>
<li><a href="#code-user-input">User input</a></li>
<li><a href="#code-block">Blocks of code</a></li>
</ul>
</li>
<li> <li>
<a href="#tables">Tables</a> <a href="#tables">Tables</a>
<ul class="nav"> <ul class="nav">
......
...@@ -69,7 +69,6 @@ base_url: "../" ...@@ -69,7 +69,6 @@ base_url: "../"
<p class="lead">Stay up to date on the development of Bootstrap and reach out to the community with these helpful resources.</p> <p class="lead">Stay up to date on the development of Bootstrap and reach out to the community with these helpful resources.</p>
<ul> <ul>
<li>Read and subscribe to <a href="http://blog.getbootstrap.com/">The Official Bootstrap Blog</a>.</li> <li>Read and subscribe to <a href="http://blog.getbootstrap.com/">The Official Bootstrap Blog</a>.</li>
<li>Have a question that's not a feature request or bug report? <a href="http://groups.google.com/group/twitter-bootstrap">Ask on the mailing list.</a></li>
<li>Chat with fellow Bootstrappers using IRC in the <code>irc.freenode.net</code> server, in the <a href="irc://irc.freenode.net/#twitter-bootstrap">##twitter-bootstrap channel</a>.</li> <li>Chat with fellow Bootstrappers using IRC in the <code>irc.freenode.net</code> server, in the <a href="irc://irc.freenode.net/#twitter-bootstrap">##twitter-bootstrap channel</a>.</li>
<li>Find inspiring examples of people building with Bootstrap at the <a href="http://expo.getbootstrap.com">Bootstrap Expo</a>.</li> <li>Find inspiring examples of people building with Bootstrap at the <a href="http://expo.getbootstrap.com">Bootstrap Expo</a>.</li>
</ul> </ul>
......
...@@ -16,7 +16,8 @@ base_url: "../" ...@@ -16,7 +16,8 @@ base_url: "../"
<h2 id="glyphicons-glyphs">Available glyphs</h2> <h2 id="glyphicons-glyphs">Available glyphs</h2>
<p>Includes 200 glyphs in font format from the Glyphicon Halflings set. <a href="http://glyphicons.com/">Glyphicons</a> Halflings are normally not available for free, but their creator has made them available for Bootstrap free of cost. As a thank you, we only ask that you to include a link back to <a href="http://glyphicons.com/">Glyphicons</a> whenever possible.</p> <p>Includes 200 glyphs in font format from the Glyphicon Halflings set. <a href="http://glyphicons.com/">Glyphicons</a> Halflings are normally not available for free, but their creator has made them available for Bootstrap free of cost. As a thank you, we only ask that you to include a link back to <a href="http://glyphicons.com/">Glyphicons</a> whenever possible.</p>
<ul class="bs-glyphicons"> <div class="bs-glyphicons">
<ul class="bs-glyphicons-list">
<li> <li>
<span class="glyphicon glyphicon-adjust"></span> <span class="glyphicon glyphicon-adjust"></span>
<span class="glyphicon-class">glyphicon glyphicon-adjust</span> <span class="glyphicon-class">glyphicon glyphicon-adjust</span>
...@@ -818,6 +819,7 @@ base_url: "../" ...@@ -818,6 +819,7 @@ base_url: "../"
<span class="glyphicon-class">glyphicon glyphicon-zoom-out</span> <span class="glyphicon-class">glyphicon glyphicon-zoom-out</span>
</li> </li>
</ul> </ul>
</div>
<h2 id="glyphicons-how-to-use">How to use</h2> <h2 id="glyphicons-how-to-use">How to use</h2>
...@@ -1172,7 +1174,7 @@ base_url: "../" ...@@ -1172,7 +1174,7 @@ base_url: "../"
<a class="btn btn-default" role="button">Middle</a> <a class="btn btn-default" role="button">Middle</a>
<div class="btn-group"> <div class="btn-group">
<a class="btn btn-default dropdown-toggle" data-toggle="dropdown"> <a class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Right dropdown <span class="caret"></span> Dropdown <span class="caret"></span>
</a> </a>
<ul class="dropdown-menu" role="menu"> <ul class="dropdown-menu" role="menu">
<li><a href="#">Action</a></li> <li><a href="#">Action</a></li>
...@@ -3354,6 +3356,43 @@ body { padding-bottom: 70px; } ...@@ -3354,6 +3356,43 @@ body { padding-bottom: 70px; }
<a href="#" class="list-group-item">Porta ac consectetur ac</a> <a href="#" class="list-group-item">Porta ac consectetur ac</a>
<a href="#" class="list-group-item">Vestibulum at eros</a> <a href="#" class="list-group-item">Vestibulum at eros</a>
</div> </div>
{% endhighlight %}
<h3 id="list-group-contextual-classes">Contextual classes</h3>
<p>Use contextual classes to style list items, default or linked. Also includes <code>.active</code> state.</p>
<div class="bs-example">
<div class="row">
<div class="col-sm-6">
<ul class="list-group">
<li class="list-group-item list-group-item-success">Dapibus ac facilisis in</li>
<li class="list-group-item list-group-item-warning">Porta ac consectetur ac</li>
<li class="list-group-item list-group-item-danger">Vestibulum at eros</li>
<li class="list-group-item list-group-item-info">Cras sit amet nibh libero</li>
</ul>
</div>
<div class="col-sm-6">
<div class="list-group">
<a href="#" class="list-group-item list-group-item-success">Dapibus ac facilisis in</a>
<a href="#" class="list-group-item list-group-item-warning">Porta ac consectetur ac</a>
<a href="#" class="list-group-item list-group-item-danger">Vestibulum at eros</a>
<a href="#" class="list-group-item list-group-item-info">Cras sit amet nibh libero</a>
</div>
</div>
</div>
</div>
{% highlight html %}
<ul class="list-group">
<li class="list-group-item list-group-item-success">Dapibus ac facilisis in</li>
<li class="list-group-item list-group-item-warning">Porta ac consectetur ac</li>
<li class="list-group-item list-group-item-danger">Vestibulum at eros</li>
<li class="list-group-item list-group-item-info">Cras sit amet nibh libero</li>
</ul>
<div class="list-group">
<a href="#" class="list-group-item list-group-item-success">Dapibus ac facilisis in</a>
<a href="#" class="list-group-item list-group-item-warning">Porta ac consectetur ac</a>
<a href="#" class="list-group-item list-group-item-danger">Vestibulum at eros</a>
<a href="#" class="list-group-item list-group-item-info">Cras sit amet nibh libero</a>
</div>
{% endhighlight %} {% endhighlight %}
<h3 id="list-group-custom-content">Custom content</h3> <h3 id="list-group-custom-content">Custom content</h3>
......
...@@ -1047,7 +1047,7 @@ base_url: "../" ...@@ -1047,7 +1047,7 @@ base_url: "../"
<h1 id="code">Code</h1> <h1 id="code">Code</h1>
</div> </div>
<h2>Inline</h2> <h2 id="code-inline">Inline</h2>
<p>Wrap inline snippets of code with <code>&lt;code&gt;</code>.</p> <p>Wrap inline snippets of code with <code>&lt;code&gt;</code>.</p>
<div class="bs-example"> <div class="bs-example">
For example, <code>&lt;section&gt;</code> should be wrapped as inline. For example, <code>&lt;section&gt;</code> should be wrapped as inline.
...@@ -1056,7 +1056,16 @@ base_url: "../" ...@@ -1056,7 +1056,16 @@ base_url: "../"
For example, <code>&lt;section&gt;</code> should be wrapped as inline. For example, <code>&lt;section&gt;</code> should be wrapped as inline.
{% endhighlight %} {% endhighlight %}
<h2>Basic block</h2> <h2 id="code-user-input">User input</h2>
<p>Use the <code>&lt;kbd&gt;</code> to indicate input that is typically entered via keyboard.</p>
<div class="bs-example">
To switch directories, type <kbd>cd</kbd> followed the name of the directory.
</div>
{% highlight html %}
To switch directories, type <kbd>cd</kbd> followed the name of the directory.
{% endhighlight %}
<h2 id="code-block">Basic block</h2>
<p>Use <code>&lt;pre&gt;</code> for multiple lines of code. Be sure to escape any angle brackets in the code for proper rendering.</p> <p>Use <code>&lt;pre&gt;</code> for multiple lines of code. Be sure to escape any angle brackets in the code for proper rendering.</p>
<div class="bs-example"> <div class="bs-example">
<pre>&lt;p&gt;Sample text here...&lt;/p&gt;</pre> <pre>&lt;p&gt;Sample text here...&lt;/p&gt;</pre>
...@@ -1327,6 +1336,12 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline. ...@@ -1327,6 +1336,12 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</td> </td>
<td>Indicates a dangerous or potentially negative action</td> <td>Indicates a dangerous or potentially negative action</td>
</tr> </tr>
<tr>
<td>
<code>.info</code>
</td>
<td>Indicates a neutral informative change or action</td>
</tr>
</tbody> </tbody>
</table> </table>
</div> </div>
...@@ -1383,6 +1398,18 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline. ...@@ -1383,6 +1398,18 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<td>Column content</td> <td>Column content</td>
<td>Column content</td> <td>Column content</td>
</tr> </tr>
<tr>
<td>8</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
<tr class="info">
<td>9</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
</tbody> </tbody>
</table> </table>
</div><!-- /example --> </div><!-- /example -->
...@@ -1392,6 +1419,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline. ...@@ -1392,6 +1419,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<tr class="success">...</tr> <tr class="success">...</tr>
<tr class="warning">...</tr> <tr class="warning">...</tr>
<tr class="danger">...</tr> <tr class="danger">...</tr>
<tr class="info">...</tr>
<!-- On cells (`td` or `th`) --> <!-- On cells (`td` or `th`) -->
<tr> <tr>
...@@ -1399,6 +1427,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline. ...@@ -1399,6 +1427,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<td class="success">...</td> <td class="success">...</td>
<td class="warning">...</td> <td class="warning">...</td>
<td class="danger">...</td> <td class="danger">...</td>
<td class="info">...</td>
</tr> </tr>
{% endhighlight %} {% endhighlight %}
......
...@@ -576,6 +576,10 @@ cite { ...@@ -576,6 +576,10 @@ cite {
text-align: center; text-align: center;
} }
.text-justify {
text-align: justify;
}
.page-header { .page-header {
padding-bottom: 9px; padding-bottom: 9px;
margin: 40px 0 20px; margin: 40px 0 20px;
...@@ -753,6 +757,15 @@ code { ...@@ -753,6 +757,15 @@ code {
border-radius: 4px; border-radius: 4px;
} }
kbd {
padding: 2px 4px;
font-size: 90%;
color: #ffffff;
background-color: #333333;
border-radius: 3px;
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}
pre { pre {
display: block; display: block;
padding: 9.5px; padding: 9.5px;
...@@ -1767,6 +1780,24 @@ table th[class*="col-"] { ...@@ -1767,6 +1780,24 @@ table th[class*="col-"] {
background-color: #d0e9c6; background-color: #d0e9c6;
} }
.table > thead > tr > .warning,
.table > tbody > tr > .warning,
.table > tfoot > tr > .warning,
.table > thead > .warning > td,
.table > tbody > .warning > td,
.table > tfoot > .warning > td,
.table > thead > .warning > th,
.table > tbody > .warning > th,
.table > tfoot > .warning > th {
background-color: #fcf8e3;
}
.table-hover > tbody > tr > .warning:hover,
.table-hover > tbody > .warning:hover > td,
.table-hover > tbody > .warning:hover > th {
background-color: #faf2cc;
}
.table > thead > tr > .danger, .table > thead > tr > .danger,
.table > tbody > tr > .danger, .table > tbody > tr > .danger,
.table > tfoot > tr > .danger, .table > tfoot > tr > .danger,
...@@ -1785,22 +1816,22 @@ table th[class*="col-"] { ...@@ -1785,22 +1816,22 @@ table th[class*="col-"] {
background-color: #ebcccc; background-color: #ebcccc;
} }
.table > thead > tr > .warning, .table > thead > tr > .info,
.table > tbody > tr > .warning, .table > tbody > tr > .info,
.table > tfoot > tr > .warning, .table > tfoot > tr > .info,
.table > thead > .warning > td, .table > thead > .info > td,
.table > tbody > .warning > td, .table > tbody > .info > td,
.table > tfoot > .warning > td, .table > tfoot > .info > td,
.table > thead > .warning > th, .table > thead > .info > th,
.table > tbody > .warning > th, .table > tbody > .info > th,
.table > tfoot > .warning > th { .table > tfoot > .info > th {
background-color: #fcf8e3; background-color: #d9edf7;
} }
.table-hover > tbody > tr > .warning:hover, .table-hover > tbody > tr > .info:hover,
.table-hover > tbody > .warning:hover > td, .table-hover > tbody > .info:hover > td,
.table-hover > tbody > .warning:hover > th { .table-hover > tbody > .info:hover > th {
background-color: #faf2cc; background-color: #c4e3f3;
} }
@media (max-width: 767px) { @media (max-width: 767px) {
...@@ -2344,7 +2375,7 @@ fieldset[disabled] .btn-default.active { ...@@ -2344,7 +2375,7 @@ fieldset[disabled] .btn-default.active {
.btn-default .badge { .btn-default .badge {
color: #ffffff; color: #ffffff;
background-color: #fff; background-color: #333333;
} }
.btn-primary { .btn-primary {
...@@ -2390,7 +2421,53 @@ fieldset[disabled] .btn-primary.active { ...@@ -2390,7 +2421,53 @@ fieldset[disabled] .btn-primary.active {
.btn-primary .badge { .btn-primary .badge {
color: #428bca; color: #428bca;
background-color: #fff; background-color: #ffffff;
}
.btn-success {
color: #ffffff;
background-color: #5cb85c;
border-color: #4cae4c;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
color: #ffffff;
background-color: #47a447;
border-color: #398439;
}
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
background-image: none;
}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
background-color: #5cb85c;
border-color: #4cae4c;
}
.btn-success .badge {
color: #5cb85c;
background-color: #ffffff;
} }
.btn-warning { .btn-warning {
...@@ -2436,7 +2513,7 @@ fieldset[disabled] .btn-warning.active { ...@@ -2436,7 +2513,7 @@ fieldset[disabled] .btn-warning.active {
.btn-warning .badge { .btn-warning .badge {
color: #f0ad4e; color: #f0ad4e;
background-color: #fff; background-color: #ffffff;
} }
.btn-danger { .btn-danger {
...@@ -2482,53 +2559,7 @@ fieldset[disabled] .btn-danger.active { ...@@ -2482,53 +2559,7 @@ fieldset[disabled] .btn-danger.active {
.btn-danger .badge { .btn-danger .badge {
color: #d9534f; color: #d9534f;
background-color: #fff; background-color: #ffffff;
}
.btn-success {
color: #ffffff;
background-color: #5cb85c;
border-color: #4cae4c;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
color: #ffffff;
background-color: #47a447;
border-color: #398439;
}
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
background-image: none;
}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
background-color: #5cb85c;
border-color: #4cae4c;
}
.btn-success .badge {
color: #5cb85c;
background-color: #fff;
} }
.btn-info { .btn-info {
...@@ -2574,7 +2605,7 @@ fieldset[disabled] .btn-info.active { ...@@ -2574,7 +2605,7 @@ fieldset[disabled] .btn-info.active {
.btn-info .badge { .btn-info .badge {
color: #5bc0de; color: #5bc0de;
background-color: #fff; background-color: #ffffff;
} }
.btn-link { .btn-link {
...@@ -4754,7 +4785,7 @@ textarea.input-group-sm > .input-group-btn > .btn { ...@@ -4754,7 +4785,7 @@ textarea.input-group-sm > .input-group-btn > .btn {
} }
.navbar-default .navbar-toggle .icon-bar { .navbar-default .navbar-toggle .icon-bar {
background-color: #cccccc; background-color: #888888;
} }
.navbar-default .navbar-collapse, .navbar-default .navbar-collapse,
...@@ -5581,6 +5612,114 @@ a.list-group-item.active:focus .list-group-item-text { ...@@ -5581,6 +5612,114 @@ a.list-group-item.active:focus .list-group-item-text {
color: #e1edf7; color: #e1edf7;
} }
.list-group-item-success {
color: #3c763d;
background-color: #dff0d8;
}
a.list-group-item-success {
color: #3c763d;
}
a.list-group-item-success .list-group-item-heading {
color: inherit;
}
a.list-group-item-success:hover,
a.list-group-item-success:focus {
color: #3c763d;
background-color: #d0e9c6;
}
a.list-group-item-success.active,
a.list-group-item-success.active:hover,
a.list-group-item-success.active:focus {
color: #fff;
background-color: #3c763d;
border-color: #3c763d;
}
.list-group-item-warning {
color: #8a6d3b;
background-color: #fcf8e3;
}
a.list-group-item-warning {
color: #8a6d3b;
}
a.list-group-item-warning .list-group-item-heading {
color: inherit;
}
a.list-group-item-warning:hover,
a.list-group-item-warning:focus {
color: #8a6d3b;
background-color: #faf2cc;
}
a.list-group-item-warning.active,
a.list-group-item-warning.active:hover,
a.list-group-item-warning.active:focus {
color: #fff;
background-color: #8a6d3b;
border-color: #8a6d3b;
}
.list-group-item-danger {
color: #a94442;
background-color: #f2dede;
}
a.list-group-item-danger {
color: #a94442;
}
a.list-group-item-danger .list-group-item-heading {
color: inherit;
}
a.list-group-item-danger:hover,
a.list-group-item-danger:focus {
color: #a94442;
background-color: #ebcccc;
}
a.list-group-item-danger.active,
a.list-group-item-danger.active:hover,
a.list-group-item-danger.active:focus {
color: #fff;
background-color: #a94442;
border-color: #a94442;
}
.list-group-item-info {
color: #31708f;
background-color: #d9edf7;
}
a.list-group-item-info {
color: #31708f;
}
a.list-group-item-info .list-group-item-heading {
color: inherit;
}
a.list-group-item-info:hover,
a.list-group-item-info:focus {
color: #31708f;
background-color: #c4e3f3;
}
a.list-group-item-info.active,
a.list-group-item-info.active:hover,
a.list-group-item-info.active:focus {
color: #fff;
background-color: #31708f;
border-color: #31708f;
}
.list-group-item-heading { .list-group-item-heading {
margin-top: 0; margin-top: 0;
margin-bottom: 5px; margin-bottom: 5px;
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -763,7 +763,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery" ...@@ -763,7 +763,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
if (e.keyCode == 38 && index > 0) index-- // up if (e.keyCode == 38 && index > 0) index-- // up
if (e.keyCode == 40 && index < $items.length - 1) index++ // down if (e.keyCode == 40 && index < $items.length - 1) index++ // down
if (!~index) index=0 if (!~index) index = 0
$items.eq(index).focus() $items.eq(index).focus()
} }
...@@ -1013,7 +1013,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery" ...@@ -1013,7 +1013,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
} else if (!this.isShown && this.$backdrop) { } else if (!this.isShown && this.$backdrop) {
this.$backdrop.removeClass('in') this.$backdrop.removeClass('in')
$.support.transition && this.$element.hasClass('fade')? $.support.transition && this.$element.hasClass('fade') ?
this.$backdrop this.$backdrop
.one($.support.transition.end, callback) .one($.support.transition.end, callback)
.emulateTransitionEnd(150) : .emulateTransitionEnd(150) :
...@@ -1213,7 +1213,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery" ...@@ -1213,7 +1213,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
} }
Tooltip.prototype.show = function () { Tooltip.prototype.show = function () {
var e = $.Event('show.bs.'+ this.type) var e = $.Event('show.bs.' + this.type)
if (this.hasContent() && this.enabled) { if (this.hasContent() && this.enabled) {
this.$element.trigger(e) this.$element.trigger(e)
......
...@@ -921,7 +921,6 @@ h1[id] { ...@@ -921,7 +921,6 @@ h1[id] {
*/ */
.highlight { .highlight {
display: none; /* hidden by default, until >480px */
padding: 9px 14px; padding: 9px 14px;
margin-bottom: 14px; margin-bottom: 14px;
background-color: #f7f7f9; background-color: #f7f7f9;
...@@ -949,13 +948,6 @@ h1[id] { ...@@ -949,13 +948,6 @@ h1[id] {
color: #bebec5; color: #bebec5;
} }
/* Show code snippets when we have the space */
@media (min-width: 481px) {
.highlight {
display: block;
}
}
/* /*
* Responsive tests * Responsive tests
...@@ -1037,11 +1029,12 @@ h1[id] { ...@@ -1037,11 +1029,12 @@ h1[id] {
*/ */
.bs-glyphicons { .bs-glyphicons {
margin: 0 -19px 20px -16px;
overflow: hidden;
}
.bs-glyphicons-list {
padding-left: 0; padding-left: 0;
padding-bottom: 1px;
margin-bottom: 20px;
list-style: none; list-style: none;
overflow: hidden;
} }
.bs-glyphicons li { .bs-glyphicons li {
float: left; float: left;
...@@ -1049,7 +1042,7 @@ h1[id] { ...@@ -1049,7 +1042,7 @@ h1[id] {
height: 115px; height: 115px;
padding: 10px; padding: 10px;
margin: 0 -1px -1px 0; margin: 0 -1px -1px 0;
font-size: 12px; font-size: 10px;
line-height: 1.4; line-height: 1.4;
text-align: center; text-align: center;
border: 1px solid #ddd; border: 1px solid #ddd;
...@@ -1069,8 +1062,13 @@ h1[id] { ...@@ -1069,8 +1062,13 @@ h1[id] {
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.bs-glyphicons {
margin-left: 0;
margin-right: 0;
}
.bs-glyphicons li { .bs-glyphicons li {
width: 12.5%; width: 12.5%;
font-size: 12px;
} }
} }
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -17,7 +17,7 @@ base_url: "../" ...@@ -17,7 +17,7 @@ base_url: "../"
<h3 id="download-compiled">Compiled CSS, JS, and fonts</h3> <h3 id="download-compiled">Compiled CSS, JS, and fonts</h3>
<p>The fastest way to get Bootstrap is to download the precompiled and minified versions of our CSS, JavaScript, and fonts. No documentation or original source code files are included.</p> <p>The fastest way to get Bootstrap is to download the precompiled and minified versions of our CSS, JavaScript, and fonts. No documentation or original source code files are included.</p>
<p><a class="btn btn-lg btn-primary" href="{{ site.download_dist }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);" role="button">Download precompiled Bootstrap</a></p> <p><a class="btn btn-lg btn-primary" href="{{ site.download_dist }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);" role="button">Download Bootstrap</a></p>
<h3 id="download-additional">Additional downloads</h3> <h3 id="download-additional">Additional downloads</h3>
<div class="bs-docs-dl-options"> <div class="bs-docs-dl-options">
...@@ -805,7 +805,8 @@ bootstrap/ ...@@ -805,7 +805,8 @@ bootstrap/
{% highlight html %} {% highlight html %}
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
{% endhighlight %} {% endhighlight %}
<p>This tag is included in all docs pages and examples to ensure the best rendering possible in each supported version of Internet Explorer.</p> <p>Confirm the document mode by opening the debugging tools: press <kbd>F12</kbd> and check the "Document Mode".</p>
<p>This tag is included in all Bootstrap's documentation and examples to ensure the best rendering possible in each supported version of Internet Explorer.</p>
<p>See <a href="http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge">this StackOverflow question</a> for more information.</p> <p>See <a href="http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge">this StackOverflow question</a> for more information.</p>
<h3 id="ie-10-width">Internet Explorer 10 in Windows 8 and Windows Phone 8</h3> <h3 id="ie-10-width">Internet Explorer 10 in Windows 8 and Windows Phone 8</h3>
......
...@@ -56,6 +56,10 @@ ...@@ -56,6 +56,10 @@
.btn-primary { .btn-primary {
.button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border); .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
} }
// Success appears as green
.btn-success {
.button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
}
// Warning appears as orange // Warning appears as orange
.btn-warning { .btn-warning {
.button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border); .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
...@@ -64,10 +68,6 @@ ...@@ -64,10 +68,6 @@
.btn-danger { .btn-danger {
.button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border); .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
} }
// Success appears as green
.btn-success {
.button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
}
// Info appears as blue-green // Info appears as blue-green
.btn-info { .btn-info {
.button-variant(@btn-info-color; @btn-info-bg; @btn-info-border); .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
......
...@@ -21,6 +21,16 @@ code { ...@@ -21,6 +21,16 @@ code {
border-radius: @border-radius-base; border-radius: @border-radius-base;
} }
// User input typically entered via keyboard
kbd {
padding: 2px 4px;
font-size: 90%;
color: @kbd-color;
background-color: @kbd-bg;
border-radius: @border-radius-small;
box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
}
// Blocks of code // Blocks of code
pre { pre {
display: block; display: block;
......
...@@ -2,17 +2,21 @@ ...@@ -2,17 +2,21 @@
// List groups // List groups
// -------------------------------------------------- // --------------------------------------------------
// Base class // Base class
// //
// Easily usable on <ul>, <ol>, or <div>. // Easily usable on <ul>, <ol>, or <div>.
.list-group { .list-group {
// No need to set list-style: none; since .list-group-item is block level // No need to set list-style: none; since .list-group-item is block level
margin-bottom: 20px; margin-bottom: 20px;
padding-left: 0; // reset padding because ul and ol padding-left: 0; // reset padding because ul and ol
} }
// Individual list items // Individual list items
// ------------------------- //
// Use on `li`s or `div`s within the `.list-group` parent.
.list-group-item { .list-group-item {
position: relative; position: relative;
...@@ -41,7 +45,12 @@ ...@@ -41,7 +45,12 @@
} }
} }
// Linked list items // Linked list items
//
// Use anchor elements instead of `li`s or `div`s to create linked list items.
// Includes an extra `.active` modifier class for showing selected items.
a.list-group-item { a.list-group-item {
color: @list-group-link-color; color: @list-group-link-color;
...@@ -75,8 +84,21 @@ a.list-group-item { ...@@ -75,8 +84,21 @@ a.list-group-item {
} }
} }
// Contextual variants
//
// Add modifier classes to change text and background color on individual items.
// Organizationally, this must come after the `:hover` states.
.list-group-item-variant(success; @state-success-bg; @state-success-text);
.list-group-item-variant(warning; @state-warning-bg; @state-warning-text);
.list-group-item-variant(danger; @state-danger-bg; @state-danger-text);
.list-group-item-variant(info; @state-info-bg; @state-info-text);
// Custom content options // Custom content options
// ------------------------- //
// Extra classes for creating well-formatted content within `.list-group-item`s.
.list-group-item-heading { .list-group-item-heading {
margin-top: 0; margin-top: 0;
......
...@@ -437,6 +437,33 @@ ...@@ -437,6 +437,33 @@
} }
} }
// List Groups
// -------------------------
.list-group-item-variant(@state; @background; @color) {
.list-group-item-@{state} {
color: @color;
background-color: @background;
}
a.list-group-item-@{state} {
color: @color;
.list-group-item-heading { color: inherit; }
&:hover,
&:focus {
color: @color;
background-color: darken(@background, 5%);
}
&.active,
&.active:hover,
&.active:focus {
color: #fff;
background-color: @color;
border-color: @color;
}
}
}
// Button variants // Button variants
// ------------------------- // -------------------------
// Easily pump out default styles, as well as :hover, :focus, :active, // Easily pump out default styles, as well as :hover, :focus, :active,
...@@ -475,7 +502,7 @@ ...@@ -475,7 +502,7 @@
.badge { .badge {
color: @background; color: @background;
background-color: #fff; background-color: @color;
} }
} }
......
...@@ -156,8 +156,9 @@ table { ...@@ -156,8 +156,9 @@ table {
// Generate the contextual variants // Generate the contextual variants
.table-row-variant(active; @table-bg-active); .table-row-variant(active; @table-bg-active);
.table-row-variant(success; @state-success-bg); .table-row-variant(success; @state-success-bg);
.table-row-variant(danger; @state-danger-bg);
.table-row-variant(warning; @state-warning-bg); .table-row-variant(warning; @state-warning-bg);
.table-row-variant(danger; @state-danger-bg);
.table-row-variant(info; @state-info-bg);
// Responsive tables // Responsive tables
......
...@@ -120,6 +120,7 @@ cite { font-style: normal; } ...@@ -120,6 +120,7 @@ cite { font-style: normal; }
.text-left { text-align: left; } .text-left { text-align: left; }
.text-right { text-align: right; } .text-right { text-align: right; }
.text-center { text-align: center; } .text-center { text-align: center; }
.text-justify { text-align: justify; }
// Page header // Page header
......
...@@ -286,7 +286,7 @@ ...@@ -286,7 +286,7 @@
// Navbar toggle // Navbar toggle
@navbar-default-toggle-hover-bg: #ddd; @navbar-default-toggle-hover-bg: #ddd;
@navbar-default-toggle-icon-bar-bg: #ccc; @navbar-default-toggle-icon-bar-bg: #888;
@navbar-default-toggle-border-color: #ddd; @navbar-default-toggle-border-color: #ddd;
...@@ -602,6 +602,9 @@ ...@@ -602,6 +602,9 @@
@code-color: #c7254e; @code-color: #c7254e;
@code-bg: #f9f2f4; @code-bg: #f9f2f4;
@kbd-color: #fff;
@kbd-bg: #333;
@pre-bg: #f5f5f5; @pre-bg: #f5f5f5;
@pre-color: @gray-dark; @pre-color: @gray-dark;
@pre-border-color: #ccc; @pre-border-color: #ccc;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment