Merge branch 'master' into pr/11648

Conflicts:
	dist/css/bootstrap.min.css
	less/grid.less

CONTRIBUTING.md

@@ -17,7 +17,7 @@ We only accept issues that are bug reports or feature requests. Bugs must be iso
 
 ## Pull requests
 
-- CSS changes must be done in `.less` files first, never just the compiled `.css` files
+- CSS changes must be done in `.less` files first, never just in the compiled `.css` files
 - If modifying the `.less` files, always recompile and commit the compiled files `bootstrap.css` and `bootstrap.min.css`
 - Try not to pollute your pull request with unintended changes--keep them simple and small
 - Try to share which browsers your code has been tested in before submitting a pull request

Gruntfile.js

@@ -11,11 +11,9 @@ module.exports = function(grunt) {
     // Metadata.
     pkg: grunt.file.readJSON('package.json'),
     banner: '/*!\n' +
-              ' * Bootstrap v<%= pkg.version %> by @fat and @mdo\n' +
+              ' * Bootstrap v<%= pkg.version %> (<%= pkg.homepage %>)\n' +
               ' * Copyright <%= grunt.template.today("yyyy") %> <%= pkg.author %>\n' +
               ' * Licensed under <%= _.pluck(pkg.licenses, "url").join(", ") %>\n' +
-              ' *\n' +
-              ' * Designed and built with all the love in the world by @mdo and @fat.\n' +
               ' */\n\n',
     jqueryCheck: 'if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery") }\n\n',
 

_includes/footer.html

@@ -1,10 +1,9 @@
 <!-- Bootstrap core JavaScript
 ================================================== -->
 <!-- Placed at the end of the document so the pages load faster -->
-<script src="https://code.jquery.com/jquery-1.10.2.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="http://platform.twitter.com/widgets.js"></script>
 <script src="{{ page.base_url }}docs-assets/js/holder.js"></script>
 
 <script src="{{ page.base_url }}docs-assets/js/application.js"></script>
@@ -18,6 +17,21 @@
 <script src="{{ page.base_url }}docs-assets/js/customizer.js"></script>
 {% endif %}
 
+{% comment %}
+  Inject Twitter widgets asynchronously. Snippet snipped from Twitter's
+  JS interface site: https://dev.twitter.com/docs/tfw-javascript
+
+  * "js.async=1;" added to add async attribute to the generated script tag.
+{% endcomment %}
+<script>
+  window.twttr = (function (d,s,id) {
+    var t, js, fjs = d.getElementsByTagName(s)[0];
+    if (d.getElementById(id)) return; js=d.createElement(s); js.id=id; js.async=1;
+    js.src="https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
+    return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
+  }(document, "script", "twitter-wjs"));
+</script>
+
 <!-- Analytics
 ================================================== -->
 <script>

dist/css/bootstrap-theme.css

@@ -1,9 +1,7 @@
 /*!
- * Bootstrap v3.0.2 by @fat and @mdo
+ * Bootstrap v3.0.2 (http://getbootstrap.com)
  * Copyright 2013 Twitter, Inc.
  * Licensed under http://www.apache.org/licenses/LICENSE-2.0
- *
- * Designed and built with all the love in the world by @mdo and @fat.
  */
 
 .btn-default,

dist/css/bootstrap.css

@@ -1,9 +1,7 @@
 /*!
- * Bootstrap v3.0.2 by @fat and @mdo
+ * Bootstrap v3.0.2 (http://getbootstrap.com)
  * Copyright 2013 Twitter, Inc.
  * Licensed under http://www.apache.org/licenses/LICENSE-2.0
- *
- * Designed and built with all the love in the world by @mdo and @fat.
  */
 
 /*! normalize.css v2.1.3 | MIT License | git.io/normalize */
@@ -426,35 +424,35 @@ cite {
 }
 
 .text-warning {
-  color: #c09853;
+  color: #8a6d3b;
 }
 
 .text-warning:hover {
-  color: #a47e3c;
+  color: #66512c;
 }
 
 .text-danger {
-  color: #b94a48;
+  color: #a94442;
 }
 
 .text-danger:hover {
-  color: #953b39;
+  color: #843534;
 }
 
 .text-success {
-  color: #468847;
+  color: #3c763d;
 }
 
 .text-success:hover {
-  color: #356635;
+  color: #2b542c;
 }
 
 .text-info {
-  color: #3a87ad;
+  color: #31708f;
 }
 
 .text-info:hover {
-  color: #2d6987;
+  color: #245269;
 }
 
 .text-left {
@@ -1731,84 +1729,75 @@ table th[class*="col-"] {
   float: none;
 }
 
-.table > thead > tr > td.active,
+.table > thead > tr > .active,
-.table > tbody > tr > td.active,
+.table > tbody > tr > .active,
-.table > tfoot > tr > td.active,
+.table > tfoot > tr > .active,
-.table > thead > tr > th.active,
+.table > thead > .active > td,
-.table > tbody > tr > th.active,
+.table > tbody > .active > td,
-.table > tfoot > tr > th.active,
+.table > tfoot > .active > td,
-.table > thead > tr.active > td,
+.table > thead > .active > th,
-.table > tbody > tr.active > td,
+.table > tbody > .active > th,
-.table > tfoot > tr.active > td,
+.table > tfoot > .active > th {
-.table > thead > tr.active > th,
-.table > tbody > tr.active > th,
-.table > tfoot > tr.active > th {
   background-color: #f5f5f5;
 }
 
-.table > thead > tr > td.success,
+.table-hover > tbody > tr > .active:hover,
-.table > tbody > tr > td.success,
+.table-hover > tbody > .active:hover > td,
-.table > tfoot > tr > td.success,
+.table-hover > tbody > .active:hover > th {
-.table > thead > tr > th.success,
+  background-color: #e8e8e8;
-.table > tbody > tr > th.success,
+}
-.table > tfoot > tr > th.success,
+
-.table > thead > tr.success > td,
+.table > thead > tr > .success,
-.table > tbody > tr.success > td,
+.table > tbody > tr > .success,
-.table > tfoot > tr.success > td,
+.table > tfoot > tr > .success,
-.table > thead > tr.success > th,
+.table > thead > .success > td,
-.table > tbody > tr.success > th,
+.table > tbody > .success > td,
-.table > tfoot > tr.success > th {
+.table > tfoot > .success > td,
+.table > thead > .success > th,
+.table > tbody > .success > th,
+.table > tfoot > .success > th {
   background-color: #dff0d8;
 }
 
-.table-hover > tbody > tr > td.success:hover,
+.table-hover > tbody > tr > .success:hover,
-.table-hover > tbody > tr > th.success:hover,
+.table-hover > tbody > .success:hover > td,
-.table-hover > tbody > tr.success:hover > td,
+.table-hover > tbody > .success:hover > th {
-.table-hover > tbody > tr.success:hover > th {
   background-color: #d0e9c6;
 }
 
-.table > thead > tr > td.danger,
+.table > thead > tr > .danger,
-.table > tbody > tr > td.danger,
+.table > tbody > tr > .danger,
-.table > tfoot > tr > td.danger,
+.table > tfoot > tr > .danger,
-.table > thead > tr > th.danger,
+.table > thead > .danger > td,
-.table > tbody > tr > th.danger,
+.table > tbody > .danger > td,
-.table > tfoot > tr > th.danger,
+.table > tfoot > .danger > td,
-.table > thead > tr.danger > td,
+.table > thead > .danger > th,
-.table > tbody > tr.danger > td,
+.table > tbody > .danger > th,
-.table > tfoot > tr.danger > td,
+.table > tfoot > .danger > th {
-.table > thead > tr.danger > th,
-.table > tbody > tr.danger > th,
-.table > tfoot > tr.danger > th {
   background-color: #f2dede;
 }
 
-.table-hover > tbody > tr > td.danger:hover,
+.table-hover > tbody > tr > .danger:hover,
-.table-hover > tbody > tr > th.danger:hover,
+.table-hover > tbody > .danger:hover > td,
-.table-hover > tbody > tr.danger:hover > td,
+.table-hover > tbody > .danger:hover > th {
-.table-hover > tbody > tr.danger:hover > th {
   background-color: #ebcccc;
 }
 
-.table > thead > tr > td.warning,
+.table > thead > tr > .warning,
-.table > tbody > tr > td.warning,
+.table > tbody > tr > .warning,
-.table > tfoot > tr > td.warning,
+.table > tfoot > tr > .warning,
-.table > thead > tr > th.warning,
+.table > thead > .warning > td,
-.table > tbody > tr > th.warning,
+.table > tbody > .warning > td,
-.table > tfoot > tr > th.warning,
+.table > tfoot > .warning > td,
-.table > thead > tr.warning > td,
+.table > thead > .warning > th,
-.table > tbody > tr.warning > td,
+.table > tbody > .warning > th,
-.table > tfoot > tr.warning > td,
+.table > tfoot > .warning > th {
-.table > thead > tr.warning > th,
-.table > tbody > tr.warning > th,
-.table > tfoot > tr.warning > th {
   background-color: #fcf8e3;
 }
 
-.table-hover > tbody > tr > td.warning:hover,
+.table-hover > tbody > tr > .warning:hover,
-.table-hover > tbody > tr > th.warning:hover,
+.table-hover > tbody > .warning:hover > td,
-.table-hover > tbody > tr.warning:hover > td,
+.table-hover > tbody > .warning:hover > th {
-.table-hover > tbody > tr.warning:hover > th {
   background-color: #faf2cc;
 }
 
@@ -2074,7 +2063,7 @@ textarea.input-sm {
 }
 
 .input-lg {
-  height: 45px;
+  height: 46px;
   padding: 10px 16px;
   font-size: 18px;
   line-height: 1.33;
@@ -2082,8 +2071,8 @@ textarea.input-sm {
 }
 
 select.input-lg {
-  height: 45px;
+  height: 46px;
-  line-height: 45px;
+  line-height: 46px;
 }
 
 textarea.input-lg {
@@ -2096,25 +2085,25 @@ textarea.input-lg {
 .has-warning .checkbox,
 .has-warning .radio-inline,
 .has-warning .checkbox-inline {
-  color: #c09853;
+  color: #8a6d3b;
 }
 
 .has-warning .form-control {
-  border-color: #c09853;
+  border-color: #8a6d3b;
   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
           box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .has-warning .form-control:focus {
-  border-color: #a47e3c;
+  border-color: #66512c;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #dbc59e;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
-          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #dbc59e;
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
 }
 
 .has-warning .input-group-addon {
-  color: #c09853;
+  color: #8a6d3b;
   background-color: #fcf8e3;
-  border-color: #c09853;
+  border-color: #8a6d3b;
 }
 
 .has-error .help-block,
@@ -2123,25 +2112,25 @@ textarea.input-lg {
 .has-error .checkbox,
 .has-error .radio-inline,
 .has-error .checkbox-inline {
-  color: #b94a48;
+  color: #a94442;
 }
 
 .has-error .form-control {
-  border-color: #b94a48;
+  border-color: #a94442;
   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
           box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .has-error .form-control:focus {
-  border-color: #953b39;
+  border-color: #843534;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
-          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392;
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
 }
 
 .has-error .input-group-addon {
-  color: #b94a48;
+  color: #a94442;
   background-color: #f2dede;
-  border-color: #b94a48;
+  border-color: #a94442;
 }
 
 .has-success .help-block,
@@ -2150,25 +2139,25 @@ textarea.input-lg {
 .has-success .checkbox,
 .has-success .radio-inline,
 .has-success .checkbox-inline {
-  color: #468847;
+  color: #3c763d;
 }
 
 .has-success .form-control {
-  border-color: #468847;
+  border-color: #3c763d;
   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
           box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .has-success .form-control:focus {
-  border-color: #356635;
+  border-color: #2b542c;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
-          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b;
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
 }
 
 .has-success .input-group-addon {
-  color: #468847;
+  color: #3c763d;
   background-color: #dff0d8;
-  border-color: #468847;
+  border-color: #3c763d;
 }
 
 .form-control-static {
@@ -3780,7 +3769,8 @@ input[type="button"].btn-block {
 }
 
 .btn-group-vertical > .btn,
-.btn-group-vertical > .btn-group {
+.btn-group-vertical > .btn-group,
+.btn-group-vertical > .btn-group > .btn {
   display: block;
   float: none;
   width: 100%;
@@ -3874,7 +3864,7 @@ input[type="button"].btn-block {
   border-collapse: separate;
 }
 
-.input-group.col {
+.input-group[class*="col-"] {
   float: none;
   padding-right: 0;
   padding-left: 0;
@@ -3888,7 +3878,7 @@ input[type="button"].btn-block {
 .input-group-lg > .form-control,
 .input-group-lg > .input-group-addon,
 .input-group-lg > .input-group-btn > .btn {
-  height: 45px;
+  height: 46px;
   padding: 10px 16px;
   font-size: 18px;
   line-height: 1.33;
@@ -3898,8 +3888,8 @@ input[type="button"].btn-block {
 select.input-group-lg > .form-control,
 select.input-group-lg > .input-group-addon,
 select.input-group-lg > .input-group-btn > .btn {
-  height: 45px;
+  height: 46px;
-  line-height: 45px;
+  line-height: 46px;
 }
 
 textarea.input-group-lg > .form-control,
@@ -4479,6 +4469,7 @@ textarea.input-group-sm > .input-group-btn > .btn {
   margin-right: 15px;
   margin-bottom: 8px;
   background-color: transparent;
+  background-image: none;
   border: 1px solid transparent;
   border-radius: 4px;
 }
@@ -5169,7 +5160,8 @@ a.list-group-item.active > .badge,
   background-color: #eeeeee;
 }
 
-.jumbotron h1 {
+.jumbotron h1,
+.jumbotron .h1 {
   line-height: 1;
   color: inherit;
 }
@@ -5182,6 +5174,10 @@ a.list-group-item.active > .badge,
   border-radius: 6px;
 }
 
+.jumbotron .container {
+  max-width: 100%;
+}
+
 @media screen and (min-width: 768px) {
   .jumbotron {
     padding-top: 48px;
@@ -5191,16 +5187,14 @@ a.list-group-item.active > .badge,
     padding-right: 60px;
     padding-left: 60px;
   }
-  .jumbotron h1 {
+  .jumbotron h1,
+  .jumbotron .h1 {
     font-size: 63px;
   }
 }
 
 .thumbnail {
-  display: inline-block;
   display: block;
-  height: auto;
-  max-width: 100%;
   padding: 4px;
   margin-bottom: 20px;
   line-height: 1.428571429;
@@ -5267,7 +5261,7 @@ a.thumbnail.active {
 }
 
 .alert-success {
-  color: #468847;
+  color: #3c763d;
   background-color: #dff0d8;
   border-color: #d6e9c6;
 }
@@ -5277,11 +5271,11 @@ a.thumbnail.active {
 }
 
 .alert-success .alert-link {
-  color: #356635;
+  color: #2b542c;
 }
 
 .alert-info {
-  color: #3a87ad;
+  color: #31708f;
   background-color: #d9edf7;
   border-color: #bce8f1;
 }
@@ -5291,11 +5285,11 @@ a.thumbnail.active {
 }
 
 .alert-info .alert-link {
-  color: #2d6987;
+  color: #245269;
 }
 
 .alert-warning {
-  color: #c09853;
+  color: #8a6d3b;
   background-color: #fcf8e3;
   border-color: #faebcc;
 }
@@ -5305,11 +5299,11 @@ a.thumbnail.active {
 }
 
 .alert-warning .alert-link {
-  color: #a47e3c;
+  color: #66512c;
 }
 
 .alert-danger {
-  color: #b94a48;
+  color: #a94442;
   background-color: #f2dede;
   border-color: #ebccd1;
 }
@@ -5319,7 +5313,7 @@ a.thumbnail.active {
 }
 
 .alert-danger .alert-link {
-  color: #953b39;
+  color: #843534;
 }
 
 @-webkit-keyframes progress-bar-stripes {
@@ -5751,7 +5745,7 @@ a.list-group-item.active:focus .list-group-item-text {
 }
 
 .panel-success > .panel-heading {
-  color: #468847;
+  color: #3c763d;
   background-color: #dff0d8;
   border-color: #d6e9c6;
 }
@@ -5769,7 +5763,7 @@ a.list-group-item.active:focus .list-group-item-text {
 }
 
 .panel-warning > .panel-heading {
-  color: #c09853;
+  color: #8a6d3b;
   background-color: #fcf8e3;
   border-color: #faebcc;
 }
@@ -5787,7 +5781,7 @@ a.list-group-item.active:focus .list-group-item-text {
 }
 
 .panel-danger > .panel-heading {
-  color: #b94a48;
+  color: #a94442;
   background-color: #f2dede;
   border-color: #ebccd1;
 }
@@ -5805,7 +5799,7 @@ a.list-group-item.active:focus .list-group-item-text {
 }
 
 .panel-info > .panel-heading {
-  color: #3a87ad;
+  color: #31708f;
   background-color: #d9edf7;
   border-color: #bce8f1;
 }
@@ -5908,9 +5902,7 @@ button.close {
   position: relative;
   z-index: 1050;
   width: auto;
-  padding: 10px;
+  margin: 10px;
-  margin-right: auto;
-  margin-left: auto;
 }
 
 .modal-content {
@@ -6008,8 +6000,7 @@ button.close {
 @media screen and (min-width: 768px) {
   .modal-dialog {
     width: 600px;
-    padding-top: 30px;
+    margin: 30px auto;
-    padding-bottom: 30px;
   }
   .modal-content {
     -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);

dist/js/bootstrap.js

@@ -1,9 +1,7 @@
 /*!
- * Bootstrap v3.0.2 by @fat and @mdo
+ * Bootstrap v3.0.2 (http://getbootstrap.com)
  * Copyright 2013 Twitter, Inc.
  * Licensed under http://www.apache.org/licenses/LICENSE-2.0
- *
- * Designed and built with all the love in the world by @mdo and @fat.
  */
 
 if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery") }
@@ -803,9 +801,9 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
   $.fn.dropdown = function (option) {
     return this.each(function () {
       var $this = $(this)
-      var data  = $this.data('dropdown')
+      var data  = $this.data('bs.dropdown')
 
-      if (!data) $this.data('dropdown', (data = new Dropdown(this)))
+      if (!data) $this.data('bs.dropdown', (data = new Dropdown(this)))
       if (typeof option == 'string') data[option].call($this)
     })
   }

docs-assets/css/docs.css

@@ -586,14 +586,14 @@ h1[id] {
   border-color: #faebcc;
 }
 .bs-callout-warning h4 {
-  color: #c09853;
+  color: #8a6d3b;
 }
 .bs-callout-info {
   background-color: #f4f8fa;
   border-color: #bce8f1;
 }
 .bs-callout-info h4 {
-  color: #3a87ad;
+  color: #34789a;
 }
 
 

examples/offcanvas/offcanvas.css

@@ -2,7 +2,8 @@
  * Style tweaks
  * --------------------------------------------------
  */
-html {
+html,
+body {
   overflow-x: hidden; /* Prevent scroll on narrow devices */
 }
 body {

getting-started.html

@@ -405,6 +405,10 @@ bootstrap/
             <td><code>.control-group</code></td>
             <td><code>.form-group</code></td>
           </tr>
+          <tr>
+            <td><code>.control-group.warning .control-group.error .control-group.success</code></td>
+            <td><code>.form-group.has-*</code></td>
+          </tr>
           <tr>
             <td><code>.checkbox.inline</code> <code>.radio.inline</code></td>
             <td><code>.checkbox-inline</code> <code>.radio-inline</code></td>
@@ -611,6 +615,11 @@ bootstrap/
             <td><code>.form-search</code></td>
             <td class="text-muted">N/A</td>
           </tr>
+          <tr>
+            <td>Form group with info</td>
+            <td><code>.control-group.info</code></td>
+            <td class="text-muted">N/A</td>
+          </tr>
           <tr>
             <td>Fluid container</td>
             <td><code>.container-fluid</code></td>
@@ -674,7 +683,7 @@ bootstrap/
       <li>Typeahead has been dropped, in favor of using <a href="http://twitter.github.io/typeahead.js/">Twitter Typeahead</a>.</li>
       <li>Modal markup has changed significantly. The <code>.modal-header</code>, <code>.modal-body</code>, and <code>.modal-footer</code> sections are now wrapped in <code>.modal-content</code> and <code>.modal-dialog</code> for better mobile styling and behavior.</li>
       <li>The HTML loaded by the <code>remote</code> modal option is now injected into the <code>.modal</code> instead of into the <code>.modal-body</code>. This allows you to also easily vary the header and footer of the modal, not just the modal body.</li>
-      <li>JavaScript events are namespaced. For example, to handle the modal "show" event, use <code>'show.bs.modal'</code>. For tabs "shown" use <code>'shown.bs.tab'</code>, etc..</li>
+      <li>JavaScript events are namespaced. For example, to handle the modal "show" event, use <code>'show.bs.modal'</code>. For tabs "shown" use <code>'shown.bs.tab'</code>, etc.</li>
     </ul>
     <p>For more information on upgrading to v3.0, and code snippets from the community, see <a href="http://bootply.com/">Bootply</a>.</p>
   </div>

javascript.html

@@ -529,6 +529,7 @@ $('#myDropdown').on('show.bs.dropdown', function () {
 {% endhighlight %}
   </div>
 
+
   <!-- ScrollSpy
   ================================================== -->
   <div class="bs-docs-section">
@@ -588,7 +589,13 @@ $('#myDropdown').on('show.bs.dropdown', function () {
     <h3>Via data attributes</h3>
     <p>To easily add scrollspy behavior to your topbar navigation, add <code>data-spy="scroll"</code> to the element you want to spy on (most typically this would be the <code>&lt;body&gt;</code>). Then add the <code>data-target</code> attribute with the ID or class of the parent element of any Bootstrap <code>.nav</code> component.</p>
 {% highlight html %}
-<body data-spy="scroll" data-target="#navbar-example">
+<body data-spy="scroll" data-target=".navbar-example">
+  ...
+  <div class="navbar-example">
+    <ul class="nav nav-tabs">
+      ...
+    </ul>
+  </div>
   ...
 </body>
 {% endhighlight %}
@@ -596,7 +603,7 @@ $('#myDropdown').on('show.bs.dropdown', function () {
     <h3>Via JavaScript</h3>
     <p>Call the scrollspy via JavaScript:</p>
 {% highlight js %}
-$('body').scrollspy({ target: '#navbar-example' })
+$('body').scrollspy({ target: '.navbar-example' })
 {% endhighlight %}
 
     <div class="bs-callout bs-callout-danger">
@@ -1408,7 +1415,7 @@ $('#my-alert').bind('closed.bs.alert', function () {
     <h2 id="buttons-usage">Usage</h2>
     <p>Enable buttons via JavaScript:</p>
 {% highlight js %}
-$('.btn-group').button()
+$('.btn').button()
 {% endhighlight %}
 
     <h3>Markup</h3>
@@ -1926,22 +1933,27 @@ $('#myCarousel').on('slide.bs.carousel', function () {
     <hr class="bs-docs-separator">
 
     <h2 id="affix-usage">Usage</h2>
+    <p>Use the affix plugin via data attributes or manually with your own JavaScript. <strong>In both situations, you must provide CSS for the positioning of your content.</strong></p>
+
+    <h3>Positioning via CSS</h3>
+    <p>The affix plugin toggles between three classes, each representing a particular state: <code>.affix</code>, <code>.affix-top</code>, and <code>.affix-bottom</code>. You must provide the styles for these classes yourself (independent of this plugin) to handle the actual positions.</p>
+    <p>Here's how the affix plugin works:</p>
+    <ol>
+      <li>To start, the plugin adds <code>.affix-top</code> to indicate the element is in it's top-most position. At this point no CSS positioning is required.</li>
+      <li>Scrolling past the element you want affixed should trigger the actual affixing. This is where <code>.affix</code> replaces <code>.affix-top</code> and sets <code>position: fixed;</code> (provided by Bootstrap's code CSS).</li>
+      <li>If a bottom offset is defined, scrolling past that should replace <code>.affix</code> with <code>.affix-bottom</code>. Since offsets are optional, setting one requires you to set the appropriate CSS. In this case, add <code>position: absolute;</code> when necessary. The plugin uses the data attribute or JavaScript option to determine where to position the elemtn from there.</li>
+    </ol>
+    <p>Follow the above steps to set your CSS for either of the usage options below.</p>
 
     <h3>Via data attributes</h3>
-    <p>To easily add affix behavior to any element, just add <code>data-spy="affix"</code> to the element you want to spy on. Then use offsets to define when to toggle the pinning of an element on and off.</p>
+    <p>To easily add affix behavior to any element, just add <code>data-spy="affix"</code> to the element you want to spy on. Use offsets to define when to toggle the pinning of an element.</p>
 
 {% highlight html %}
-<div data-spy="affix" data-offset-top="200">...</div>
+<div data-spy="affix" data-offset-top="60" data-offset-bottom="200">
+  ...
+</div>
 {% endhighlight %}
 
-    <div class="bs-callout bs-callout-warning">
-      <h4>Requires independent styling ;)</h4>
-      <p>
-        Affix toggles between three states/classes: <code>.affix</code>, <code>.affix-top</code>, and <code>.affix-bottom</code>. You must provide the styles for these classes yourself (independent of this plugin).
-        The <code>.affix-top</code> class should be in the regular flow of the document. The <code>.affix</code> class should be <code>position: fixed</code>. And <code>.affix-bottom</code> should be <code>position: absolute</code>. Note: <code>.affix-bottom</code> is special in that the plugin will place the element with JS relative to the <code>offset: { bottom: number }</code> option you've provided.
-      </p>
-    </div>
-
     <h3>Via JavaScript</h3>
     <p>Call the affix plugin via JavaScript:</p>
 {% highlight js %}

js/dropdown.js

@@ -123,9 +123,9 @@
   $.fn.dropdown = function (option) {
     return this.each(function () {
       var $this = $(this)
-      var data  = $this.data('dropdown')
+      var data  = $this.data('bs.dropdown')
 
-      if (!data) $this.data('dropdown', (data = new Dropdown(this)))
+      if (!data) $this.data('bs.dropdown', (data = new Dropdown(this)))
       if (typeof option == 'string') data[option].call($this)
     })
   }

less/button-groups.less

@@ -147,7 +147,8 @@
 
 .btn-group-vertical {
   > .btn,
-  > .btn-group {
+  > .btn-group,
+  > .btn-group > .btn {
     display: block;
     float: none;
     width: 100%;

less/grid.less

@@ -28,8 +28,8 @@
 
 // Extra small grid
 //
-// Grid classes for extra small devices like smartphones. No offset, push, or
+// Columns, offsets, pushes, and pulls for extra small devices like
-// pull classes are present here due to the size of the target.
+// smartphones.
 
 .make-grid-columns-float(xs);
 .make-grid(@grid-columns, xs, width);

less/input-groups.less

@@ -10,7 +10,7 @@
   border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table
 
   // Undo padding and float of grid classes
-  &.col {
+  &[class*="col-"] {
     float: none;
     padding-left: 0;
     padding-right: 0;

less/jumbotron.less

@@ -12,7 +12,8 @@
   color: @jumbotron-color;
   background-color: @jumbotron-bg;
 
-  h1 {
+  h1,
+  .h1 {
     line-height: 1;
     color: @jumbotron-heading-color;
   }
@@ -24,6 +25,10 @@
     border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container
   }
 
+  .container {
+    max-width: 100%;
+  }
+
   @media screen and (min-width: @screen-sm-min) {
     padding-top:    (@jumbotron-padding * 1.6);
     padding-bottom: (@jumbotron-padding * 1.6);
@@ -33,7 +38,8 @@
       padding-right: (@jumbotron-padding * 2);
     }
 
-    h1 {
+    h1,
+    .h1 {
       font-size: (@font-size-base * 4.5);
     }
   }

less/mixins.less

@@ -19,8 +19,8 @@
 .clearfix() {
   &:before,
   &:after {
-    content: " "; /* 1 */
+    content: " "; // 1
-    display: table; /* 2 */
+    display: table; // 2
   }
   &:after {
     clear: both;
@@ -428,27 +428,27 @@
 
 // Tables
 // -------------------------
-.table-row-variant(@state; @background; @border) {
+.table-row-variant(@state; @background) {
   // Exact selectors below required to override `.table-striped` and prevent
   // inheritance to nested tables.
-  .table > thead > tr,
+  .table {
-  .table > tbody > tr,
+    > thead,
-  .table > tfoot > tr {
+    > tbody,
-    > td.@{state},
+    > tfoot {
-    > th.@{state},
+      > tr > .@{state},
-    &.@{state} > td,
+      > .@{state} > td,
-    &.@{state} > th {
+      > .@{state} > th {
-      background-color: @background;
+        background-color: @background;
+      }
     }
   }
 
   // Hover states for `.table-hover`
   // Note: this is not available for cells or rows within `thead` or `tfoot`.
-  .table-hover > tbody > tr {
+  .table-hover > tbody {
-    > td.@{state}:hover,
+    > tr > .@{state}:hover,
-    > th.@{state}:hover,
+    > .@{state}:hover > td,
-    &.@{state}:hover > td,
+    > .@{state}:hover > th {
-    &.@{state}:hover > th {
       background-color: darken(@background, 5%);
     }
   }

less/modals.less

@@ -35,10 +35,8 @@
 // Shell div to position the modal with bottom padding
 .modal-dialog {
   position: relative;
-  margin-left: auto;
-  margin-right: auto;
   width: auto;
-  padding: 10px;
+  margin: 10px;
   z-index: (@zindex-modal-background + 10);
 }
 
@@ -122,8 +120,7 @@
 
   .modal-dialog {
     width: 600px;
-    padding-top: 30px;
+    margin: 30px auto;
-    padding-bottom: 30px;
   }
   .modal-content {
     .box-shadow(0 5px 15px rgba(0,0,0,.5));

less/navbar.less

@@ -180,6 +180,7 @@
   padding: 9px 10px;
   .navbar-vertical-align(34px);
   background-color: transparent;
+  background-image: none; // Fix for at least Firefox on Android, per #11468
   border: 1px solid transparent;
   border-radius: @border-radius-base;
 

less/tables.less

@@ -152,25 +152,11 @@ table {
 // Exact selectors below required to override `.table-striped` and prevent
 // inheritance to nested tables.
 
-.table {
-  > thead,
-  > tbody,
-  > tfoot {
-    > tr {
-      > td.active,
-      > th.active,
-      &.active > td,
-      &.active > th  {
-        background-color: @table-bg-active;
-      }
-    }
-  }
-}
-
 // Generate the contextual variants
-.table-row-variant(success; @state-success-bg; @state-success-border);
+.table-row-variant(active; @table-bg-active);
-.table-row-variant(danger; @state-danger-bg; @state-danger-border);
+.table-row-variant(success; @state-success-bg);
-.table-row-variant(warning; @state-warning-bg; @state-warning-border);
+.table-row-variant(danger; @state-danger-bg);
+.table-row-variant(warning; @state-warning-bg);
 
 
 // Responsive tables

less/thumbnails.less

@@ -5,9 +5,14 @@
 
 // Mixin and adjust the regular image class
 .thumbnail {
-  .img-thumbnail();
+  display: block;
-  display: block; // Override the inline-block from `.img-thumbnail`
+  padding: @thumbnail-padding;
   margin-bottom: @line-height-computed;
+  line-height: @line-height-base;
+  background-color: @thumbnail-bg;
+  border: 1px solid @thumbnail-border;
+  border-radius: @thumbnail-border-radius;
+  .transition(all .2s ease-in-out);
 
   > img {
     .img-responsive();

less/variables.less

@@ -157,7 +157,7 @@
 @input-color-placeholder:        @gray-light;
 
 @input-height-base:              (@line-height-computed + (@padding-base-vertical * 2) + 2);
-@input-height-large:             (floor(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
+@input-height-large:             (ceil(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
 @input-height-small:             (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);
 
 @legend-color:                   @gray-dark;
@@ -372,19 +372,19 @@
 // Form states and alerts
 // -------------------------
 
-@state-success-text:             #468847;
+@state-success-text:             #3c763d;
 @state-success-bg:               #dff0d8;
 @state-success-border:           darken(spin(@state-success-bg, -10), 5%);
 
-@state-info-text:                #3a87ad;
+@state-info-text:                #31708f;
 @state-info-bg:                  #d9edf7;
 @state-info-border:              darken(spin(@state-info-bg, -10), 7%);
 
-@state-warning-text:             #c09853;
+@state-warning-text:             #8a6d3b;
 @state-warning-bg:               #fcf8e3;
 @state-warning-border:           darken(spin(@state-warning-bg, -10), 5%);
 
-@state-danger-text:              #b94a48;
+@state-danger-text:              #a94442;
 @state-danger-bg:                #f2dede;
 @state-danger-border:            darken(spin(@state-danger-bg, -10), 5%);
 

package.json

@@ -37,4 +37,15 @@
     , "grunt-sed": "~0.1.1"
     , "regexp-quote": "~0.0.0"
   }
+  , "jspm": {
+      "main": "js/bootstrap"
+    , "directories": { "lib": "dist" }
+    , "shim": {
+        "js/bootstrap": {
+            "imports": "jquery"
+          , "exports": "$"
+        }
+    }
+    , "buildConfig": { "uglify": true }
+  }
 }