diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 0ab9a33b4aa780e234cce36bca3e0dc1bbe76abe..bcaa06ed26496f8e121a7382d58d1dbeab08dbf5 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -3058,7 +3058,8 @@ button.close {
border-radius: 5px;
}
-.btn-large [class^="icon-"] {
+.btn-large [class^="icon-"],
+.btn-large [class*=" icon-"] {
margin-top: 2px;
}
@@ -3070,7 +3071,8 @@ button.close {
border-radius: 3px;
}
-.btn-small [class^="icon-"] {
+.btn-small [class^="icon-"],
+.btn-small [class*=" icon-"] {
margin-top: 0;
}
diff --git a/docs/assets/img/examples/bootstrap-example-sticky-footer.png b/docs/assets/img/examples/bootstrap-example-sticky-footer.png
new file mode 100644
index 0000000000000000000000000000000000000000..c5a1f5f0154c1efc4f818f3ec15a73fdaae54137
Binary files /dev/null and b/docs/assets/img/examples/bootstrap-example-sticky-footer.png differ
diff --git a/docs/base-css.html b/docs/base-css.html
index 1cf70023630056a31e6a44a9a21da7b43d3a5261..8d0261e5c6e22c6cf7dd2010ac48ddbdbec3202f 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -153,14 +153,14 @@
</pre>
<h3>Bold</h3>
- <p>For emphasizing a snippet of text with <strong>important</strong></p>
+ <p>For emphasizing a snippet of text with a heavier font-weight.</p>
<div class="bs-docs-example">
<p>The following snippet of text is <strong>rendered as bold text</strong>.</p>
</div>
<pre class="prettyprint"><strong>rendered as bold text</strong></pre>
<h3>Italics</h3>
- <p>For emphasizing a snippet of text with <em>stress</em></p>
+ <p>For emphasizing a snippet of text with italics.</p>
<div class="bs-docs-example">
<p>The following snippet of text is <em>rendered as italicized text</em>.</p>
</div>
@@ -507,7 +507,7 @@ For example, <code><section></code> should be wrapped as inlin
<h2>Optional classes</h2>
- <p>Add any of the follow classes to the <code>.table</code> base class.</p>
+ <p>Add any of the following classes to the <code>.table</code> base class.</p>
<h3><code>.table-striped</code></h3>
<p>Adds zebra-striping to any table row within the <code><tbody></code> via the <code>:nth-child</code> CSS selector (not available in IE8).</p>
diff --git a/docs/examples/marketing-narrow.html b/docs/examples/marketing-narrow.html
new file mode 100644
index 0000000000000000000000000000000000000000..a05d1ca4a37e03c5368adab54530a2afebda1662
--- /dev/null
+++ b/docs/examples/marketing-narrow.html
@@ -0,0 +1,137 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Template · Bootstrap</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+
+ <!-- Le styles -->
+ <link href="../assets/css/bootstrap.css" rel="stylesheet">
+ <style type="text/css">
+ body {
+ padding-top: 20px;
+ padding-bottom: 40px;
+ }
+
+ /* Custom container */
+ .container-narrow {
+ margin: 0 auto;
+ max-width: 700px;
+ }
+ .container-narrow > hr {
+ margin: 30px 0;
+ }
+
+ /* Main marketing message and sign up button */
+ .jumbotron {
+ margin: 60px 0;
+ text-align: center;
+ }
+ .jumbotron h1 {
+ font-size: 72px;
+ line-height: 1;
+ }
+ .jumbotron .btn {
+ font-size: 21px;
+ padding: 14px 24px;
+ }
+
+ /* Supporting marketing content */
+ .marketing {
+ margin: 60px 0;
+ }
+ .marketing p + h4 {
+ margin-top: 28px;
+ }
+ </style>
+ <link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
+
+ <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <!-- Fav and touch icons -->
+ <link rel="shortcut icon" href="../assets/ico/favicon.ico">
+ <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
+ </head>
+
+ <body>
+
+ <div class="container-narrow">
+
+ <div class="masthead">
+ <ul class="nav nav-pills pull-right">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">About</a></li>
+ <li><a href="#">Contact</a></li>
+ </ul>
+ <h3 class="muted">Project name</h3>
+ </div>
+
+ <hr>
+
+ <div class="jumbotron">
+ <h1>Super awesome marketing speak!</h1>
+ <p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
+ <a class="btn btn-large btn-success" href="#">Sign up today</a>
+ </div>
+
+ <hr>
+
+ <div class="row-fluid marketing">
+ <div class="span6">
+ <h4>Subheading</h4>
+ <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
+
+ <h4>Subheading</h4>
+ <p>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.</p>
+
+ <h4>Subheading</h4>
+ <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
+ </div>
+
+ <div class="span6">
+ <h4>Subheading</h4>
+ <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
+
+ <h4>Subheading</h4>
+ <p>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.</p>
+
+ <h4>Subheading</h4>
+ <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
+ </div>
+ </div>
+
+ <hr>
+
+ <div class="footer">
+ <p>© Company 2012</p>
+ </div>
+
+ </div> <!-- /container -->
+
+ <!-- Le javascript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../assets/js/jquery.js"></script>
+ <script src="../assets/js/bootstrap-transition.js"></script>
+ <script src="../assets/js/bootstrap-alert.js"></script>
+ <script src="../assets/js/bootstrap-modal.js"></script>
+ <script src="../assets/js/bootstrap-dropdown.js"></script>
+ <script src="../assets/js/bootstrap-scrollspy.js"></script>
+ <script src="../assets/js/bootstrap-tab.js"></script>
+ <script src="../assets/js/bootstrap-tooltip.js"></script>
+ <script src="../assets/js/bootstrap-popover.js"></script>
+ <script src="../assets/js/bootstrap-button.js"></script>
+ <script src="../assets/js/bootstrap-collapse.js"></script>
+ <script src="../assets/js/bootstrap-carousel.js"></script>
+ <script src="../assets/js/bootstrap-typeahead.js"></script>
+
+ </body>
+</html>
diff --git a/docs/examples/signin.html b/docs/examples/signin.html
new file mode 100644
index 0000000000000000000000000000000000000000..379bac708112a26043beb27119d28f0a22d572b6
--- /dev/null
+++ b/docs/examples/signin.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Sign in · Twitter Bootstrap</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+
+ <!-- Le styles -->
+ <link href="../assets/css/bootstrap.css" rel="stylesheet">
+ <style type="text/css">
+ body {
+ padding-top: 40px;
+ padding-bottom: 40px;
+ background-color: #f5f5f5;
+ }
+
+ .form-signin {
+ max-width: 300px;
+ padding: 19px 29px 29px;
+ margin: 0 auto 20px;
+ background-color: #fff;
+ border: 1px solid #e5e5e5;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+ -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
+ -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
+ box-shadow: 0 1px 2px rgba(0,0,0,.05);
+ }
+ .form-signin .form-signin-heading,
+ .form-signin .checkbox {
+ margin-bottom: 10px;
+ }
+ .form-signin input[type="text"],
+ .form-signin input[type="password"] {
+ font-size: 16px;
+ height: auto;
+ margin-bottom: 15px;
+ padding: 7px 9px;
+ }
+
+ </style>
+ <link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
+
+ <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <!-- Fav and touch icons -->
+ <link rel="shortcut icon" href="../assets/ico/favicon.ico">
+ <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
+ </head>
+
+ <body>
+
+ <div class="container">
+
+ <form class="form-signin">
+ <h2 class="form-signin-heading">Please sign in</h2>
+ <input type="text" class="input-block-level" placeholder="Email address">
+ <input type="password" class="input-block-level" placeholder="Password">
+ <label class="checkbox">
+ <input type="checkbox" value="remember-me"> Remember me
+ </label>
+ <button class="btn btn-large btn-primary" type="submit">Sign in</button>
+ </form>
+
+ </div> <!-- /container -->
+
+ <!-- Le javascript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../assets/js/jquery.js"></script>
+ <script src="../assets/js/bootstrap-transition.js"></script>
+ <script src="../assets/js/bootstrap-alert.js"></script>
+ <script src="../assets/js/bootstrap-modal.js"></script>
+ <script src="../assets/js/bootstrap-dropdown.js"></script>
+ <script src="../assets/js/bootstrap-scrollspy.js"></script>
+ <script src="../assets/js/bootstrap-tab.js"></script>
+ <script src="../assets/js/bootstrap-tooltip.js"></script>
+ <script src="../assets/js/bootstrap-popover.js"></script>
+ <script src="../assets/js/bootstrap-button.js"></script>
+ <script src="../assets/js/bootstrap-collapse.js"></script>
+ <script src="../assets/js/bootstrap-carousel.js"></script>
+ <script src="../assets/js/bootstrap-typeahead.js"></script>
+
+ </body>
+</html>
diff --git a/docs/examples/sticky-footer.html b/docs/examples/sticky-footer.html
new file mode 100644
index 0000000000000000000000000000000000000000..50fab606b14cdf71e05282920bf09cbb05f443f4
--- /dev/null
+++ b/docs/examples/sticky-footer.html
@@ -0,0 +1,124 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Sticky footer · Twitter Bootstrap</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+
+ <!-- CSS -->
+ <link href="../assets/css/bootstrap.css" rel="stylesheet">
+ <style type="text/css">
+
+ /* Sticky footer styles
+ -------------------------------------------------- */
+
+ html,
+ body {
+ height: 100%;
+ /* The html and body elements cannot have any padding or margin. */
+ }
+
+ /* Wrapper for page content to push down footer */
+ #wrap {
+ min-height: 100%;
+ height: auto !important;
+ height: 100%;
+ /* Negative indent footer by it's height */
+ margin: 0 auto -60px;
+ }
+
+ /* Set the fixed height of the footer here */
+ #push,
+ #footer {
+ height: 60px;
+ }
+ #footer {
+ background-color: #f5f5f5;
+ }
+
+ /* Lastly, apply responsive CSS fixes as necessary */
+ @media (max-width: 767px) {
+ #footer {
+ margin-left: -20px;
+ margin-right: -20px;
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+ }
+
+
+
+ /* Custom page CSS
+ -------------------------------------------------- */
+ /* Not required for template or sticky footer method. */
+
+ .container {
+ width: auto;
+ max-width: 680px;
+ }
+ .container .credit {
+ margin: 20px 0;
+ }
+
+ </style>
+ <link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
+
+ <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <!-- Fav and touch icons -->
+ <link rel="shortcut icon" href="../assets/ico/favicon.ico">
+ <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
+ </head>
+
+ <body>
+
+
+ <!-- Part 1: Wrap all page content here -->
+ <div id="wrap">
+
+ <!-- Begin page content -->
+ <div class="container">
+ <div class="page-header">
+ <h1>Sticky footer</h1>
+ </div>
+ <p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.</p>
+ </div>
+
+ <div id="push"></div>
+ </div>
+
+ <div id="footer">
+ <div class="container">
+ <p class="muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
+ </div>
+ </div>
+
+
+
+ <!-- Le javascript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../assets/js/jquery.js"></script>
+ <script src="../assets/js/bootstrap-transition.js"></script>
+ <script src="../assets/js/bootstrap-alert.js"></script>
+ <script src="../assets/js/bootstrap-modal.js"></script>
+ <script src="../assets/js/bootstrap-dropdown.js"></script>
+ <script src="../assets/js/bootstrap-scrollspy.js"></script>
+ <script src="../assets/js/bootstrap-tab.js"></script>
+ <script src="../assets/js/bootstrap-tooltip.js"></script>
+ <script src="../assets/js/bootstrap-popover.js"></script>
+ <script src="../assets/js/bootstrap-button.js"></script>
+ <script src="../assets/js/bootstrap-collapse.js"></script>
+ <script src="../assets/js/bootstrap-carousel.js"></script>
+ <script src="../assets/js/bootstrap-typeahead.js"></script>
+
+ </body>
+</html>
diff --git a/docs/getting-started.html b/docs/getting-started.html
index 0c137899557c750bb6ec3565847fbde6c0339e9b..c37c037bd660c891e4e444568eac0c323a9333da 100644
--- a/docs/getting-started.html
+++ b/docs/getting-started.html
@@ -239,21 +239,21 @@
</div>
<p class="lead">Move beyond the base template with a few example layouts. We encourage folks to iterate on these examples and not simply use them as an end result.</p>
<div class="row bootstrap-examples">
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/hero.html">
<img src="assets/img/examples/bootstrap-example-hero.jpg" alt="">
</a>
<h4>Basic marketing site</h4>
<p>Featuring a hero unit for a primary message and three supporting elements.</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/fluid.html">
<img src="assets/img/examples/bootstrap-example-fluid.jpg" alt="">
</a>
<h4>Fluid layout</h4>
<p>Uses our new responsive, fluid grid system to create a seamless liquid layout.</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/starter-template.html">
<img src="assets/img/examples/bootstrap-example-starter.jpg" alt="">
</a>
@@ -261,28 +261,39 @@
<p>A barebones HTML document with all the Bootstrap CSS and JavaScript included.</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/marketing-narrow.html">
<img src="assets/img/examples/bootstrap-example-marketing-narrow.png" alt="">
</a>
<h4>Narrow marketing</h4>
<p>Slim, lightweight marketing template for small projects or teams.</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/signin.html">
<img src="assets/img/examples/bootstrap-example-signin.png" alt="">
</a>
<h4>Sign in</h4>
<p>Barebones sign in form with custom, larger form controls and a flexible layout.</p>
</div>
- <div class="span3">
+ <div class="span4">
+ <a class="thumbnail" href="examples/sticky-footer.html">
+ <img src="assets/img/examples/bootstrap-example-sticky-footer.png" alt="">
+ </a>
+ <h4>Sticky footer</h4>
+ <p>Pin a fixed-height footer to the bottom of the user's viewport.</p>
+ </div>
+
+<!--
+ <div class="span4">
<a class="thumbnail" href="examples/carousel.html">
<img src="assets/img/examples/bootstrap-example-carousel.png" alt="">
</a>
<h4>Carousel jumbotron</h4>
<p>A more interactive riff on the basic marketing site featuring a prominent carousel.</p>
</div>
+-->
</div>
+
</section>
diff --git a/docs/index.html b/docs/index.html
index 64cfbae1f94de879e2b511c0ec08b6862695d2fb..bba88b3be54961df89282b5b8d14aadb7d76e739 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -71,11 +71,22 @@
<div class="container">
<h1>Bootstrap</h1>
<p>Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
- <p><a href="assets/bootstrap.zip" class="btn btn-primary btn-large" >Download Bootstrap</a></p>
+ <p>
+ <a href="assets/bootstrap.zip" class="btn btn-primary btn-large" >Download Bootstrap</a>
+ </p>
<ul class="masthead-links">
- <li><a href="http://github.com/twitter/bootstrap" >GitHub project</a></li>
- <li><a href="./extend.html" >Extend</a></li>
- <li>Version 2.1.2</li>
+ <li>
+ <a href="http://github.com/twitter/bootstrap" >GitHub project</a>
+ </li>
+ <li>
+ <a href="./getting-started.html#examples" >Examples</a>
+ </li>
+ <li>
+ <a href="./extend.html" >Extend</a>
+ </li>
+ <li>
+ Version 2.1.2
+ </li>
</ul>
</div>
</div>
diff --git a/docs/javascript.html b/docs/javascript.html
index 75901bc068e5966d50e29c485db52828951cd218..03d67013282d2fbe10f790d2ea22fa587c533bcd 100644
--- a/docs/javascript.html
+++ b/docs/javascript.html
@@ -247,10 +247,10 @@ $('#myModal').on('show', function (e) {
<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Launch demo modal</a>
</div>
<pre class="prettyprint linenums">
-<-- Button to trigger modal -->
+<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
-<-- Modal -->
+<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index e41aa408ef4c7ce71f18126a2961db443df9eb2a..1a91ff3879f9f4701664b14dcf64ebe3df02a238 100644
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -89,14 +89,14 @@
</pre>
<h3>{{_i}}Bold{{/i}}</h3>
- <p>{{_i}}For emphasizing a snippet of text with <strong>important</strong>{{/i}}</p>
+ <p>{{_i}}For emphasizing a snippet of text with a heavier font-weight.{{/i}}</p>
<div class="bs-docs-example">
<p>The following snippet of text is <strong>rendered as bold text</strong>.</p>
</div>
<pre class="prettyprint"><strong>rendered as bold text</strong></pre>
<h3>{{_i}}Italics{{/i}}</h3>
- <p>{{_i}}For emphasizing a snippet of text with <em>stress</em>{{/i}}</p>
+ <p>{{_i}}For emphasizing a snippet of text with italics.{{/i}}</p>
<div class="bs-docs-example">
<p>The following snippet of text is <em>rendered as italicized text</em>.</p>
</div>
@@ -446,7 +446,7 @@
<h2>{{_i}}Optional classes{{/i}}</h2>
- <p>{{_i}}Add any of the follow classes to the <code>.table</code> base class.{{/i}}</p>
+ <p>{{_i}}Add any of the following classes to the <code>.table</code> base class.{{/i}}</p>
<h3><code>{{_i}}.table-striped{{/i}}</code></h3>
<p>{{_i}}Adds zebra-striping to any table row within the <code><tbody></code> via the <code>:nth-child</code> CSS selector (not available in IE8).{{/i}}</p>
diff --git a/docs/templates/pages/getting-started.mustache b/docs/templates/pages/getting-started.mustache
index bfc2e8a3add7b793f314664c55e6e12dda7b494d..5086c56321cc5f75baf7d23b0c50628ff5bfa6bd 100644
--- a/docs/templates/pages/getting-started.mustache
+++ b/docs/templates/pages/getting-started.mustache
@@ -170,21 +170,21 @@
</div>
<p class="lead">{{_i}}Move beyond the base template with a few example layouts. We encourage folks to iterate on these examples and not simply use them as an end result.{{/i}}</p>
<div class="row bootstrap-examples">
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/hero.html">
<img src="assets/img/examples/bootstrap-example-hero.jpg" alt="">
</a>
<h4>{{_i}}Basic marketing site{{/i}}</h4>
<p>{{_i}}Featuring a hero unit for a primary message and three supporting elements.{{/i}}</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/fluid.html">
<img src="assets/img/examples/bootstrap-example-fluid.jpg" alt="">
</a>
<h4>{{_i}}Fluid layout{{/i}}</h4>
<p>{{_i}}Uses our new responsive, fluid grid system to create a seamless liquid layout.{{/i}}</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/starter-template.html">
<img src="assets/img/examples/bootstrap-example-starter.jpg" alt="">
</a>
@@ -192,28 +192,39 @@
<p>{{_i}}A barebones HTML document with all the Bootstrap CSS and JavaScript included.{{/i}}</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/marketing-narrow.html">
<img src="assets/img/examples/bootstrap-example-marketing-narrow.png" alt="">
</a>
<h4>{{_i}}Narrow marketing{{/i}}</h4>
<p>{{_i}}Slim, lightweight marketing template for small projects or teams.{{/i}}</p>
</div>
- <div class="span3">
+ <div class="span4">
<a class="thumbnail" href="examples/signin.html">
<img src="assets/img/examples/bootstrap-example-signin.png" alt="">
</a>
<h4>{{_i}}Sign in{{/i}}</h4>
<p>{{_i}}Barebones sign in form with custom, larger form controls and a flexible layout.{{/i}}</p>
</div>
- <div class="span3">
+ <div class="span4">
+ <a class="thumbnail" href="examples/sticky-footer.html">
+ <img src="assets/img/examples/bootstrap-example-sticky-footer.png" alt="">
+ </a>
+ <h4>{{_i}}Sticky footer{{/i}}</h4>
+ <p>{{_i}}Pin a fixed-height footer to the bottom of the user's viewport.{{/i}}</p>
+ </div>
+
+<!--
+ <div class="span4">
<a class="thumbnail" href="examples/carousel.html">
<img src="assets/img/examples/bootstrap-example-carousel.png" alt="">
</a>
<h4>{{_i}}Carousel jumbotron{{/i}}</h4>
<p>{{_i}}A more interactive riff on the basic marketing site featuring a prominent carousel.{{/i}}</p>
</div>
+-->
</div>
+
</section>
diff --git a/docs/templates/pages/index.mustache b/docs/templates/pages/index.mustache
index 43e9ff410cb0931133e3691311249dd3dc4c537c..0b4e8e3f1bd765d2785a4bbbd0f066f4771fdbc4 100644
--- a/docs/templates/pages/index.mustache
+++ b/docs/templates/pages/index.mustache
@@ -2,11 +2,22 @@
<div class="container">
<h1>{{_i}}Bootstrap{{/i}}</h1>
<p>{{_i}}Sleek, intuitive, and powerful front-end framework for faster and easier web development.{{/i}}</p>
- <p><a href="assets/bootstrap.zip" class="btn btn-primary btn-large" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 2.1.2']);"{{/production}}>{{_i}}Download Bootstrap{{/i}}</a></p>
+ <p>
+ <a href="assets/bootstrap.zip" class="btn btn-primary btn-large" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 2.1.2']);"{{/production}}>{{_i}}Download Bootstrap{{/i}}</a>
+ </p>
<ul class="masthead-links">
- <li><a href="http://github.com/twitter/bootstrap" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'GitHub project']);"{{/production}}>{{_i}}GitHub project{{/i}}</a></li>
- <li><a href="./extend.html" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Extend']);"{{/production}}>{{_i}}Extend{{/i}}</a></li>
- <li>{{_i}}Version 2.1.2{{/i}}</li>
+ <li>
+ <a href="http://github.com/twitter/bootstrap" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'GitHub project']);"{{/production}}>{{_i}}GitHub project{{/i}}</a>
+ </li>
+ <li>
+ <a href="./getting-started.html#examples" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);"{{/production}}>{{_i}}Examples{{/i}}</a>
+ </li>
+ <li>
+ <a href="./extend.html" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Extend']);"{{/production}}>{{_i}}Extend{{/i}}</a>
+ </li>
+ <li>
+ {{_i}}Version 2.1.2{{/i}}
+ </li>
</ul>
</div>
</div>
diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache
index 1afb408725568052978c9b76b55c7ddb0615d5bb..6b7821f101710a3072fe28445b116d4e9498a07f 100644
--- a/docs/templates/pages/javascript.mustache
+++ b/docs/templates/pages/javascript.mustache
@@ -179,10 +179,10 @@ $('#myModal').on('show', function (e) {
<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">{{_i}}Launch demo modal{{/i}}</a>
</div>{{! /example }}
<pre class="prettyprint linenums">
-<-- Button to trigger modal -->
+<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">{{_i}}Launch demo modal{{/i}}</a>
-<-- Modal -->
+<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
diff --git a/less/buttons.less b/less/buttons.less
index 33441ac7017ddb07baa9b4c198bf02a62b1b3c53..25bfb9ae9fd077e2255f03d52b99f61530989592 100644
--- a/less/buttons.less
+++ b/less/buttons.less
@@ -72,7 +72,8 @@
font-size: @fontSizeLarge;
.border-radius(@borderRadiusLarge);
}
-.btn-large [class^="icon-"] {
+.btn-large [class^="icon-"],
+.btn-large [class*=" icon-"] {
margin-top: 2px;
}
@@ -82,7 +83,8 @@
font-size: @fontSizeSmall;
.border-radius(@borderRadiusSmall);
}
-.btn-small [class^="icon-"] {
+.btn-small [class^="icon-"],
+.btn-small [class*=" icon-"] {
margin-top: 0;
}