Merge remote-tracking branch 'upstream/master' into node-requirable

Conflicts:
	Gruntfile.js

25 files changed, 249 insertions, 134 deletions

diff --git a/less/.csscomb.json b/less/.csscomb.json
index 8456e41df..40695a478 100644
--- a/less/.csscomb.json
+++ b/less/.csscomb.json
@@ -1,16 +1,21 @@
 {
   "always-semicolon": true,
   "block-indent": 2,
-  "colon-space": [0, 1],
   "color-case": "lower",
   "color-shorthand": true,
-  "combinator-space": true,
   "element-case": "lower",
   "eof-newline": true,
   "leading-zero": false,
   "remove-empty-rulesets": true,
-  "rule-indent": 2,
-  "stick-brace": " ",
+  "space-after-colon": 1,
+  "space-after-combinator": 1,
+  "space-before-selector-delimiter": 0,
+  "space-between-declarations": "\n",
+  "space-after-opening-brace": "\n",
+  "space-before-closing-brace": "\n",
+  "space-before-colon": 0,
+  "space-before-combinator": 1,
+  "space-before-opening-brace": 1,
   "strip-spaces": true,
   "unitless-zero": true,
   "vendor-prefix-align": true,
@@ -109,6 +114,8 @@
       "list-style-type",
       "list-style-image",
       "pointer-events",
+      "-ms-touch-action",
+      "touch-action",
       "cursor",
       "visibility",
       "zoom",
diff --git a/less/alerts.less b/less/alerts.less
index c3afeb958..df070b8ab 100644
--- a/less/alerts.less
+++ b/less/alerts.less
@@ -33,11 +33,12 @@
   }
 }
 
-// Dismissable alerts
+// Dismissible alerts
 //
 // Expand the right padding and account for the close button's positioning.
 
-.alert-dismissable {
+.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0.
+.alert-dismissible {
   padding-right: (@alert-padding + 20);
 
   // Adjust close link position
diff --git a/less/button-groups.less b/less/button-groups.less
index 7021ecd17..c2e2260f0 100644
--- a/less/button-groups.less
+++ b/less/button-groups.less
@@ -232,9 +232,14 @@
 //
 // See https://github.com/twbs/bootstrap/pull/12794 for more.
 
-[data-toggle="buttons"] > .btn > input[type="radio"],
-[data-toggle="buttons"] > .btn > input[type="checkbox"] {
-  position: absolute;
-  z-index: -1;
-  .opacity(0);
+[data-toggle="buttons"] {
+  > .btn,
+  > .btn-group > .btn {
+    input[type="radio"],
+    input[type="checkbox"] {
+      position: absolute;
+      z-index: -1;
+      .opacity(0);
+    }
+  }
 }
diff --git a/less/buttons.less b/less/buttons.less
index d4fc156be..d32c4e2d8 100644
--- a/less/buttons.less
+++ b/less/buttons.less
@@ -12,6 +12,7 @@
   font-weight: @btn-font-weight;
   text-align: center;
   vertical-align: middle;
+  touch-action: manipulation;
   cursor: pointer;
   background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
   border: 1px solid transparent;
@@ -22,13 +23,15 @@
   &,
   &:active,
   &.active {
-    &:focus {
+    &:focus,
+    &.focus {
       .tab-focus();
     }
   }
 
   &:hover,
-  &:focus {
+  &:focus,
+  &.focus {
     color: @btn-default-color;
     text-decoration: none;
   }
@@ -85,11 +88,11 @@
 .btn-link {
   color: @link-color;
   font-weight: normal;
-  cursor: pointer;
   border-radius: 0;
 
   &,
   &:active,
+  &.active,
   &[disabled],
   fieldset[disabled] & {
     background-color: transparent;
@@ -140,8 +143,6 @@
 .btn-block {
   display: block;
   width: 100%;
-  padding-left: 0;
-  padding-right: 0;
 }
 
 // Vertically space out multiple block buttons
diff --git a/less/carousel.less b/less/carousel.less
index 1644ddf7f..5724d8a56 100644
--- a/less/carousel.less
+++ b/less/carousel.less
@@ -24,6 +24,30 @@
       &:extend(.img-responsive);
       line-height: 1;
     }
+
+    // WebKit CSS3 transforms for supported devices
+    @media all and (transform-3d), (-webkit-transform-3d) {
+      transition: transform .6s ease-in-out;
+      backface-visibility: hidden;
+      perspective: 1000;
+
+      &.next,
+      &.active.right {
+        transform: translate3d(100%, 0, 0);
+        left: 0;
+      }
+      &.prev,
+      &.active.left {
+        transform: translate3d(-100%, 0, 0);
+        left: 0;
+      }
+      &.next.left,
+      &.prev.right,
+      &.active {
+        transform: translate3d(0, 0, 0);
+        left: 0;
+      }
+    }
   }
 
   > .active,
diff --git a/less/code.less b/less/code.less
index baa13df61..a08b4d48c 100644
--- a/less/code.less
+++ b/less/code.less
@@ -32,6 +32,7 @@ kbd {
   kbd {
     padding: 0;
     font-size: 100%;
+    font-weight: bold;
     box-shadow: none;
   }
 }
diff --git a/less/dropdowns.less b/less/dropdowns.less
index 8d0a6a2d0..742c91265 100644
--- a/less/dropdowns.less
+++ b/less/dropdowns.less
@@ -103,9 +103,8 @@
   &:focus {
     color: @dropdown-link-disabled-color;
   }
-}
-// Nuke hover/focus effects
-.dropdown-menu > .disabled > a {
+
+  // Nuke hover/focus effects
   &:hover,
   &:focus {
     text-decoration: none;
@@ -155,6 +154,7 @@
   font-size: @font-size-small;
   line-height: @line-height-base;
   color: @dropdown-header-color;
+  white-space: nowrap; // as with > li > a
 }
 
 // Backdrop to catch body clicks on mobile, etc.
@@ -211,4 +211,3 @@
     }
   }
 }
-
diff --git a/less/forms.less b/less/forms.less
index 2f629b0a1..6077ae7a3 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -183,9 +183,26 @@ input[type="month"] {
 
   &.input-sm {
     line-height: @input-height-small;
+    line-height: @line-height-small ~"\0";
   }
   &.input-lg {
     line-height: @input-height-large;
+    line-height: @line-height-large ~"\0";
+  }
+}
+
+// IE 11 hack to reverse the iOS temporal input hack.
+_:-ms-fullscreen, :root input[type="date"],
+_:-ms-fullscreen, :root input[type="time"],
+_:-ms-fullscreen, :root input[type="datetime-local"],
+_:-ms-fullscreen, :root input[type="month"] {
+  line-height: @line-height-base;
+
+  &.input-sm {
+    line-height: @line-height-small;
+  }
+  &.input-lg {
+    line-height: @line-height-large;
   }
 }
 
@@ -208,11 +225,11 @@ input[type="month"] {
 .checkbox {
   position: relative;
   display: block;
-  min-height: @line-height-computed; // clear the floating input if there is no label text
   margin-top: 10px;
   margin-bottom: 10px;
 
   label {
+    min-height: @line-height-computed; // Ensure the input doesn't jump when there is no text
     padding-left: 20px;
     margin-bottom: 0;
     font-weight: normal;
@@ -281,16 +298,38 @@ input[type="checkbox"] {
 }
 
 
+// Static form control text
+//
+// Apply class to a `p` element to make any string of text align with labels in
+// a horizontal form layout.
+
+.form-control-static {
+  // Size it appropriately next to real form controls
+  padding-top: (@padding-base-vertical + 1);
+  padding-bottom: (@padding-base-vertical + 1);
+  // Remove default margin from `p`
+  margin-bottom: 0;
+
+  &.input-lg,
+  &.input-sm {
+    padding-left: 0;
+    padding-right: 0;
+  }
+}
+
+
 // Form control sizing
 //
 // Build on `.form-control` with modifier classes to decrease or increase the
 // height and font-size of form controls.
 
-.input-sm {
+.input-sm,
+.form-group-sm .form-control {
   .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
 }
 
-.input-lg {
+.input-lg,
+.form-group-lg .form-control {
   .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
 }
 
@@ -311,7 +350,7 @@ input[type="checkbox"] {
 // Feedback icon (requires .glyphicon classes)
 .form-control-feedback {
   position: absolute;
-  top: (@line-height-computed + 5); // Height of the `label` and its margin
+  top: 0;
   right: 0;
   z-index: 2; // Ensure icon is above input groups
   display: block;
@@ -319,6 +358,7 @@ input[type="checkbox"] {
   height: @input-height-base;
   line-height: @input-height-base;
   text-align: center;
+  pointer-events: none;
 }
 .input-lg + .form-control-feedback {
   width: @input-height-large;
@@ -342,20 +382,15 @@ input[type="checkbox"] {
   .form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg);
 }
 
+// Reposition feedback icon if input has visible label above
+.has-feedback label {
 
-// Reposition feedback icon if label is hidden with "screenreader only" state
-.has-feedback label.sr-only ~ .form-control-feedback {
-  top: 0;
-}
-
-
-// Static form control text
-//
-// Apply class to a `p` element to make any string of text align with labels in
-// a horizontal form layout.
-
-.form-control-static {
-  margin-bottom: 0; // Remove default margin from `p`
+  & ~ .form-control-feedback {
+     top: (@line-height-computed + 5); // Height of the `label` and its margin
+  }
+  &.sr-only ~ .form-control-feedback {
+     top: 0;
+  }
 }
 
 
@@ -372,7 +407,6 @@ input[type="checkbox"] {
 }
 
 
-
 // Inline forms
 //
 // Make forms appear inline(-block) by adding the `.form-inline` class. Inline
@@ -402,6 +436,11 @@ input[type="checkbox"] {
       vertical-align: middle;
     }
 
+    // Make static controls behave like regular ones
+    .form-control-static {
+      display: inline-block;
+    }
+
     .input-group {
       display: inline-table;
       vertical-align: middle;
@@ -439,14 +478,11 @@ input[type="checkbox"] {
     }
     .radio input[type="radio"],
     .checkbox input[type="checkbox"] {
-      float: none;
+      position: relative;
       margin-left: 0;
     }
 
-    // Validation states
-    //
-    // Reposition the icon because it's now within a grid column and columns have
-    // `position: relative;` on them. Also accounts for the grid gutter padding.
+    // Re-override the feedback icon.
     .has-feedback .form-control-feedback {
       top: 0;
     }
@@ -484,11 +520,6 @@ input[type="checkbox"] {
     .make-row();
   }
 
-  .form-control-static {
-    padding-top: (@padding-base-vertical + 1);
-    padding-bottom: (@padding-base-vertical + 1);
-  }
-
   // Reset spacing and right align labels, but scope to media queries so that
   // labels on narrow viewports stack the same as a default form example.
   @media (min-width: @screen-sm-min) {
@@ -504,7 +535,25 @@ input[type="checkbox"] {
   // Reposition the icon because it's now within a grid column and columns have
   // `position: relative;` on them. Also accounts for the grid gutter padding.
   .has-feedback .form-control-feedback {
-    top: 0;
     right: (@grid-gutter-width / 2);
   }
+
+  // Form group sizes
+  //
+  // Quick utility class for applying `.input-lg` and `.input-sm` styles to the
+  // inputs and labels within a `.form-group`.
+  .form-group-lg {
+    @media (min-width: @screen-sm-min) {
+      .control-label {
+        padding-top: ((@padding-large-vertical * @line-height-large) + 1);
+      }
+    }
+  }
+  .form-group-sm {
+    @media (min-width: @screen-sm-min) {
+      .control-label {
+        padding-top: (@padding-small-vertical + 1);
+      }
+    }
+  }
 }
diff --git a/less/list-group.less b/less/list-group.less
index 2514389b1..1e62d3b94 100644
--- a/less/list-group.less
+++ b/less/list-group.less
@@ -74,6 +74,7 @@ a.list-group-item {
   &.disabled:focus {
     background-color: @list-group-disabled-bg;
     color: @list-group-disabled-color;
+    cursor: not-allowed;
 
     // Force color to inherit for custom content
     .list-group-item-heading {
@@ -94,7 +95,9 @@ a.list-group-item {
     border-color: @list-group-active-border;
 
     // Force color to inherit for custom content
-    .list-group-item-heading {
+    .list-group-item-heading,
+    .list-group-item-heading > small,
+    .list-group-item-heading > .small {
       color: inherit;
     }
     .list-group-item-text {
diff --git a/less/mixins/buttons.less b/less/mixins/buttons.less
index 409f8f20a..92d8a056c 100644
--- a/less/mixins/buttons.less
+++ b/less/mixins/buttons.less
@@ -10,6 +10,7 @@
 
   &:hover,
   &:focus,
+  &.focus,
   &:active,
   &.active,
   .open > .dropdown-toggle& {
@@ -28,6 +29,7 @@
     &,
     &:hover,
     &:focus,
+    &.focus,
     &:active,
     &.active {
       background-color: @background;
diff --git a/less/mixins/forms.less b/less/mixins/forms.less
index e36c4a8cf..6f55ed967 100644
--- a/less/mixins/forms.less
+++ b/less/mixins/forms.less
@@ -10,7 +10,11 @@
   .radio,
   .checkbox,
   .radio-inline,
-  .checkbox-inline  {
+  .checkbox-inline,
+  &.radio label,
+  &.checkbox label,
+  &.radio-inline label,
+  &.checkbox-inline label  {
     color: @text-color;
   }
   // Set the border and box shadow on specific inputs to match
diff --git a/less/mixins/labels.less b/less/mixins/labels.less
index 6f9e490b8..9f7a67ee3 100644
--- a/less/mixins/labels.less
+++ b/less/mixins/labels.less
@@ -2,7 +2,7 @@
 
 .label-variant(@color) {
   background-color: @color;
-  
+
   &[href] {
     &:hover,
     &:focus {
diff --git a/less/mixins/progress-bar.less b/less/mixins/progress-bar.less
index f71a57154..f07996a34 100644
--- a/less/mixins/progress-bar.less
+++ b/less/mixins/progress-bar.less
@@ -2,6 +2,8 @@
 
 .progress-bar-variant(@color) {
   background-color: @color;
+
+  // Deprecated parent class requirement as of v3.2.0
   .progress-striped & {
     #gradient > .striped();
   }
diff --git a/less/mixins/vendor-prefixes.less b/less/mixins/vendor-prefixes.less
index 4418ac911..e2008c8b2 100644
--- a/less/mixins/vendor-prefixes.less
+++ b/less/mixins/vendor-prefixes.less
@@ -1,6 +1,6 @@
 // Vendor Prefixes
 //
-// All vendor mixins are deprecated as of v3.2 due to the introduction of
+// All vendor mixins are deprecated as of v3.2.0 due to the introduction of
 // Autoprefixer in our Gruntfile. They will be removed in v4.
 
 // - Animations
@@ -131,10 +131,10 @@
           transform: scaleY(@ratio);
 }
 .skew(@x; @y) {
-  -webkit-transform: skew(@x, @y);
+  -webkit-transform: skewX(@x) skewY(@y);
       -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
-       -o-transform: skew(@x, @y);
-          transform: skew(@x, @y);
+       -o-transform: skewX(@x) skewY(@y);
+          transform: skewX(@x) skewY(@y);
 }
 .translate(@x; @y) {
   -webkit-transform: translate(@x, @y);
diff --git a/less/navbar.less b/less/navbar.less
index 55bfd2942..c7bdd36cc 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -92,7 +92,7 @@
   .navbar-collapse {
     max-height: @navbar-collapse-max-height;
 
-    @media (max-width: @screen-xs-min) and (orientation: landscape) {
+    @media (max-device-width: @screen-xs-min) and (orientation: landscape) {
       max-height: 200px;
     }
   }
@@ -173,6 +173,10 @@
     text-decoration: none;
   }
 
+  > img {
+    display: block;
+  }
+
   @media (min-width: @grid-float-breakpoint) {
     .navbar > .container &,
     .navbar > .container-fluid & {
@@ -271,26 +275,10 @@
         padding-bottom: @navbar-padding-vertical;
       }
     }
-
-    &.navbar-right:last-child {
-      margin-right: -@navbar-padding-horizontal;
-    }
   }
 }
 
 
-// Component alignment
-//
-// Repurpose the pull utilities as their own navbar utilities to avoid specificity
-// issues with parents and chaining. Only do this when the navbar is uncollapsed
-// though so that navbar contents properly stack and align in mobile.
-
-@media (min-width: @grid-float-breakpoint) {
-  .navbar-left  { .pull-left(); }
-  .navbar-right { .pull-right(); }
-}
-
-
 // Navbar form
 //
 // Extension of the `.form-inline` with some extra flavor for optimum display in
@@ -326,11 +314,6 @@
     padding-top: 0;
     padding-bottom: 0;
     .box-shadow(none);
-
-    // Outdent the form if last child to line up with content down the page
-    &.navbar-right:last-child {
-      margin-right: -@navbar-padding-horizontal;
-    }
   }
 }
 
@@ -375,14 +358,31 @@
     float: left;
     margin-left: @navbar-padding-horizontal;
     margin-right: @navbar-padding-horizontal;
+  }
+}
+
+
+// Component alignment
+//
+// Repurpose the pull utilities as their own navbar utilities to avoid specificity
+// issues with parents and chaining. Only do this when the navbar is uncollapsed
+// though so that navbar contents properly stack and align in mobile.
+//
+// Declared after the navbar components to ensure more specificity on the margins.
+
+@media (min-width: @grid-float-breakpoint) {
+  .navbar-left  { .pull-left(); }
+  .navbar-right {
+    .pull-right();
+    margin-right: -@navbar-padding-horizontal;
 
-    // Outdent the form if last child to line up with content down the page
-    &.navbar-right:last-child {
+    ~ .navbar-right {
       margin-right: 0;
     }
   }
 }
 
+
 // Alternate navbars
 // --------------------------------------------------
 
diff --git a/less/pager.less b/less/pager.less
index 59103f445..73a660d64 100644
--- a/less/pager.less
+++ b/less/pager.less
@@ -51,5 +51,4 @@
       cursor: not-allowed;
     }
   }
-
 }
diff --git a/less/panels.less b/less/panels.less
index 2dc21316d..9136cbfdf 100644
--- a/less/panels.less
+++ b/less/panels.less
@@ -100,6 +100,11 @@
   > .table-responsive > .table,
   > .panel-collapse > .table {
     margin-bottom: 0;
+
+    caption {
+      padding-left: @panel-body-padding;
+      padding-right: @panel-body-padding;
+    }
   }
   // Add border top radius for first one
   > .table:first-child,
@@ -140,7 +145,9 @@
     }
   }
   > .panel-body + .table,
-  > .panel-body + .table-responsive {
+  > .panel-body + .table-responsive,
+  > .table + .panel-body,
+  > .table-responsive + .panel-body {
     border-top: 1px solid @table-border-color;
   }
   > .table > tbody:first-child > tr:first-child th,
diff --git a/less/popovers.less b/less/popovers.less
index bf6af40a0..ab720f2fb 100644
--- a/less/popovers.less
+++ b/less/popovers.less
@@ -11,7 +11,11 @@
   display: none;
   max-width: @popover-max-width;
   padding: 1px;
-  text-align: left; // Reset given new insertion method
+  // Reset font and text propertes given new insertion method
+  font-size: @font-size-base;
+  font-weight: normal;
+  line-height: @line-height-base;
+  text-align: left;
   background-color: @popover-bg;
   background-clip: padding-box;
   border: 1px solid @popover-fallback-border-color;
@@ -33,8 +37,6 @@
   margin: 0; // reset heading margin
   padding: 8px 14px;
   font-size: @font-size-base;
-  font-weight: normal;
-  line-height: 18px;
   background-color: @popover-title-bg;
   border-bottom: 1px solid darken(@popover-title-bg, 5%);
   border-radius: (@border-radius-large - 1) (@border-radius-large - 1) 0 0;
@@ -129,5 +131,4 @@
       bottom: -@popover-arrow-width;
     }
   }
-
 }
diff --git a/less/print.less b/less/print.less
index 3655d0395..473f361b9 100644
--- a/less/print.less
+++ b/less/print.less
@@ -4,7 +4,6 @@
 // Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css
 
 @media print {
-
   * {
     text-shadow: none !important;
     color: #000 !important; // Black prints faster: h5bp.com/s
@@ -97,5 +96,4 @@
       border: 1px solid #ddd !important;
     }
   }
-
 }
diff --git a/less/progress-bars.less b/less/progress-bars.less
index 74b702843..d5fbfb7db 100644
--- a/less/progress-bars.less
+++ b/less/progress-bars.less
@@ -6,6 +6,13 @@
 // Bar animations
 // -------------------------
 
+// WebKit
+@-webkit-keyframes progress-bar-stripes {
+  from  { background-position: 40px 0; }
+  to    { background-position: 0 0; }
+}
+
+// Spec and IE10+
 @keyframes progress-bar-stripes {
   from  { background-position: 40px 0; }
   to    { background-position: 0 0; }
@@ -41,23 +48,27 @@
 }
 
 // Striped bars
-.progress-striped .progress-bar {
+//
+// `.progress-striped .progress-bar` is deprecated as of v3.2.0 in favor of the
+// `.progress-bar-striped` class, which you just add to an existing
+// `.progress-bar`.
+.progress-striped .progress-bar,
+.progress-bar-striped {
   #gradient > .striped();
   background-size: 40px 40px;
 }
 
 // Call animation for the active one
-.progress.active .progress-bar {
+//
+// `.progress.active .progress-bar` is deprecated as of v3.2.0 in favor of the
+// `.progress-bar.active` approach.
+.progress.active .progress-bar,
+.progress-bar.active {
   .animation(progress-bar-stripes 2s linear infinite);
 }
 
 // Account for lower percentages
 .progress-bar {
-  &[aria-valuenow="1"],
-  &[aria-valuenow="2"] {
-    min-width: 30px;
-  }
-
   &[aria-valuenow="0"] {
     color: @gray-light;
     min-width: 30px;
diff --git a/less/tables.less b/less/tables.less
index 2e1ef337b..4a578588c 100644
--- a/less/tables.less
+++ b/less/tables.less
@@ -6,6 +6,12 @@
 table {
   background-color: @table-bg;
 }
+caption {
+  padding-top: @table-cell-padding;
+  padding-bottom: @table-cell-padding;
+  color: @text-muted;
+  text-align: left;
+}
 th {
   text-align: left;
 }
@@ -106,10 +112,7 @@ th {
 
 .table-striped {
   > tbody > tr:nth-child(odd) {
-    > td,
-    > th {
-      background-color: @table-bg-accent;
-    }
+    background-color: @table-bg-accent;
   }
 }
 
@@ -120,10 +123,7 @@ th {
 
 .table-hover {
   > tbody > tr:hover {
-    > td,
-    > th {
-      background-color: @table-bg-hover;
-    }
+    background-color: @table-bg-hover;
   }
 }
 
@@ -169,14 +169,14 @@ table {
 // will display normally.
 
 .table-responsive {
+  overflow-x: auto;
+
   @media screen and (max-width: @screen-xs-max) {
     width: 100%;
     margin-bottom: (@line-height-computed * 0.75);
     overflow-y: hidden;
-    overflow-x: auto;
     -ms-overflow-style: -ms-autohiding-scrollbar;
     border: 1px solid @table-border-color;
-    -webkit-overflow-scrolling: touch;
 
     // Tighten up spacing
     > .table {
diff --git a/less/theme.less b/less/theme.less
index 6f957fb39..559e11e26 100644
--- a/less/theme.less
+++ b/less/theme.less
@@ -48,6 +48,12 @@
     background-color: darken(@btn-color, 12%);
     border-color: darken(@btn-color, 14%);
   }
+
+  &:disabled,
+  &[disabled] {
+    background-color: darken(@btn-color, 12%);
+    background-image: none;
+  }
 }
 
 // Common styles
@@ -110,6 +116,7 @@
   @shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075);
   .box-shadow(@shadow);
 
+  .navbar-nav > .open > a,
   .navbar-nav > .active > a {
     #gradient > .vertical(@start-color: darken(@navbar-default-bg, 5%); @end-color: darken(@navbar-default-bg, 2%));
     .box-shadow(inset 0 3px 9px rgba(0,0,0,.075));
@@ -125,6 +132,7 @@
   #gradient > .vertical(@start-color: lighten(@navbar-inverse-bg, 10%); @end-color: @navbar-inverse-bg);
   .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered
 
+  .navbar-nav > .open > a,
   .navbar-nav > .active > a {
     #gradient > .vertical(@start-color: @navbar-inverse-bg; @end-color: lighten(@navbar-inverse-bg, 2.5%));
     .box-shadow(inset 0 3px 9px rgba(0,0,0,.25));
@@ -191,6 +199,11 @@
 .progress-bar-warning    { .progress-bar-styles(@progress-bar-warning-bg); }
 .progress-bar-danger     { .progress-bar-styles(@progress-bar-danger-bg); }
 
+// Reset the striped class because our mixins don't do multiple gradients and
+// the above custom styles override the new `.progress-bar-striped` in v3.2.0.
+.progress-bar-striped {
+  #gradient > .striped();
+}
 
 
 //
diff --git a/less/type.less b/less/type.less
index 93414474a..6ab3c0804 100644
--- a/less/type.less
+++ b/less/type.less
@@ -74,15 +74,10 @@ p {
 // Emphasis & misc
 // -------------------------
 
-// Ex: 14px base font * 85% = about 12px
+// Ex: (12px small font / 14px base font) * 100% = about 85%
 small,
 .small {
-  font-size: 85%;
-}
-
-// Undo browser default styling
-cite {
-  font-style: normal;
+  font-size: floor((100% * @font-size-small / @font-size-base));
 }
 
 mark,
@@ -219,13 +214,13 @@ dd {
   @media (min-width: @grid-float-breakpoint) {
     dt {
       float: left;
-      width: (@component-offset-horizontal - 20);
+      width: (@dl-horizontal-offset - 20);
       clear: left;
       text-align: right;
       .text-overflow();
     }
     dd {
-      margin-left: @component-offset-horizontal;
+      margin-left: @dl-horizontal-offset;
     }
   }
 }
diff --git a/less/utilities.less b/less/utilities.less
index c0becabe3..a26031214 100644
--- a/less/utilities.less
+++ b/less/utilities.less
@@ -53,5 +53,4 @@
 
 .affix {
   position: fixed;
-  .translate3d(0, 0, 0);
 }
diff --git a/less/variables.less b/less/variables.less
index a2e464b6e..5be258be7 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -7,11 +7,12 @@
 //
 //## Gray and brand colors for use across Bootstrap.
 
-@gray-darker:            lighten(#000, 13.5%); // #222
-@gray-dark:              lighten(#000, 20%);   // #333
-@gray:                   lighten(#000, 33.5%); // #555
-@gray-light:             lighten(#000, 60%);   // #999
-@gray-lighter:           lighten(#000, 93.5%); // #eee
+@gray-base:              #000;
+@gray-darker:            lighten(@gray-base, 13.5%); // #222
+@gray-dark:              lighten(@gray-base, 20%);   // #333
+@gray:                   lighten(@gray-base, 33.5%); // #555
+@gray-light:             lighten(@gray-base, 46.7%); // #777
+@gray-lighter:           lighten(@gray-base, 93.5%); // #eee
 
 @brand-primary:         #428bca;
 @brand-success:         #5cb85c;
@@ -187,7 +188,7 @@
 @input-border-focus:             #66afe9;
 
 //** Placeholder text color
-@input-color-placeholder:        @gray-light;
+@input-color-placeholder:        #999;
 
 //** Default `.form-control` height
 @input-height-base:              (@line-height-computed + (@padding-base-vertical * 2) + 2);
@@ -368,12 +369,12 @@
 
 // Inverted navbar
 // Reset inverted navbar basics
-@navbar-inverse-color:                      @gray-light;
+@navbar-inverse-color:                      lighten(@gray-light, 15%);
 @navbar-inverse-bg:                         #222;
 @navbar-inverse-border:                     darken(@navbar-inverse-bg, 10%);
 
 // Inverted navbar links
-@navbar-inverse-link-color:                 @gray-light;
+@navbar-inverse-link-color:                 lighten(@gray-light, 15%);
 @navbar-inverse-link-hover-color:           #fff;
 @navbar-inverse-link-hover-bg:              transparent;
 @navbar-inverse-link-active-color:          @navbar-inverse-link-hover-color;
@@ -403,8 +404,6 @@
 @nav-disabled-link-color:                   @gray-light;
 @nav-disabled-link-hover-color:             @gray-light;
 
-@nav-open-link-hover-color:                 #fff;
-
 //== Tabs
 @nav-tabs-border-color:                     #ddd;
 
@@ -822,6 +821,8 @@
 //
 //##
 
+//** Horizontal offset for forms and lists.
+@component-offset-horizontal: 180px;
 //** Text muted color
 @text-muted:                  @gray-light;
 //** Abbreviations and acronyms border color
@@ -836,14 +837,7 @@
 @blockquote-border-color:     @gray-lighter;
 //** Page header border color
 @page-header-border-color:    @gray-lighter;
-
-
-//== Miscellaneous
-//
-//##
-
+//** Width of horizontal description list titles
+@dl-horizontal-offset:        @component-offset-horizontal;
 //** Horizontal line color.
 @hr-border:                   @gray-lighter;
-
-//** Horizontal offset for forms and lists.
-@component-offset-horizontal: 180px;