Update to Bootstrap v2.2.0

2012-10-30 18:04:28 -05:00
parent 332b990a3d
commit 6735edced0
35 changed files with 411 additions and 186 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,5 @@
 ### HEAD
+* Update to Bootstrap 2.2.0
 * Return instead of echo class names in `roots_main_class` and `roots_sidebar_class`
 * Move nav customizations into `lib/nav.php`

--- a/assets/css/bootstrap-responsive.css
+++ b/assets/css/bootstrap-responsive.css
--- a/assets/css/bootstrap.css
+++ b/assets/css/bootstrap.css
--- a/assets/css/less/accordion.less
+++ b/assets/css/less/accordion.less
@@ -12,7 +12,7 @@
 .accordion-group {
  margin-bottom: 2px;
  border: 1px solid #e5e5e5;
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
 }
 .accordion-heading {
  border-bottom: 0;
--- a/assets/css/less/alerts.less
+++ b/assets/css/less/alerts.less
@@ -12,7 +12,7 @@
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
  background-color: @warningBackground;
  border: 1px solid @warningBorder;
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
  color: @warningText;
 }
 .alert h4 {
--- a/assets/css/less/bootstrap.less
+++ b/assets/css/less/bootstrap.less
@@ -1,5 +1,5 @@
 /*!
- * Bootstrap v2.1.1
+ * Bootstrap v2.2.0
 *
 * Copyright 2012 Twitter, Inc
 * Licensed under the Apache License v2.0
@@ -52,6 +52,7 @@

 // Components: Misc
@import "thumbnails.less";
+@import "media.less";
@import "labels-badges.less";
@import "progress-bars.less";
@import "accordion.less";
--- a/assets/css/less/breadcrumbs.less
+++ b/assets/css/less/breadcrumbs.less
@@ -8,7 +8,7 @@
  margin: 0 0 @baseLineHeight;
  list-style: none;
  background-color: #f5f5f5;
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
  li {
    display: inline-block;
    .ie7-inline-block();
--- a/assets/css/less/button-groups.less
+++ b/assets/css/less/button-groups.less
@@ -6,6 +6,8 @@
 // Make the div behave like a button
 .btn-group {
  position: relative;
+  display: inline-block;
+  .ie7-inline-block();
  font-size: 0; // remove as part 1 of font-size inline-block hack
  vertical-align: middle; // match .btn alignment given font-size hack above
  white-space: nowrap; // prevent buttons from wrapping when in tight spaces (e.g., the table on the tests page)
@@ -22,10 +24,6 @@
  font-size: 0; // Hack to remove whitespace that results from using inline-block
  margin-top: @baseLineHeight / 2;
  margin-bottom: @baseLineHeight / 2;
-  .btn-group {
-    display: inline-block;
-    .ie7-inline-block();
-  }
  .btn + .btn,
  .btn-group + .btn,
  .btn + .btn-group {
@@ -120,7 +118,7 @@
 .btn-group > .btn + .dropdown-toggle {
  padding-left: 8px;
  padding-right: 8px;
-  .box-shadow(inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05));
+  .box-shadow(~"inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)");
  *padding-top: 5px;
  *padding-bottom: 5px;
 }
@@ -147,7 +145,7 @@
  // Remove the gradient and set the same inset shadow as the :active state
  .dropdown-toggle {
    background-image: none;
-    .box-shadow(inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05));
+    .box-shadow(~"inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)");
  }

  // Keep the hover's background when dropdown is open
@@ -193,8 +191,7 @@
 }
 // Upside down carets for .dropup
 .dropup .btn-large .caret {
-  border-bottom: 5px solid @black;
-  border-top: 0;
+  border-bottom-width: 5px;
 }


--- a/assets/css/less/buttons.less
+++ b/assets/css/less/buttons.less
@@ -10,7 +10,7 @@
 .btn {
  display: inline-block;
  .ie7-inline-block();
-  padding: 4px 14px;
+  padding: 4px 12px;
  margin-bottom: 0; // For input.btn
  font-size: @baseFontSize;
  line-height: @baseLineHeight;
@@ -22,9 +22,9 @@
  border: 1px solid @btnBorder;
  *border: 0; // Remove the border to prevent IE7's black border on input:focus
  border-bottom-color: darken(@btnBorder, 10%);
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
  .ie7-restore-left-whitespace(); // Give IE7 some love
-  .box-shadow(inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05));
+  .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)");

  // Hover state
  &:hover {
@@ -51,7 +51,7 @@
    background-color: darken(@white, 15%) e("\9");
    background-image: none;
    outline: 0;
-    .box-shadow(inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05));
+    .box-shadow(~"inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)");
  }

  // Disabled state
@@ -73,30 +73,31 @@

 // Large
 .btn-large {
-  padding: 9px 14px;
-  font-size: @baseFontSize + 2px;
-  line-height: normal;
-  .border-radius(5px);
+  padding: @paddingLarge;
+  font-size: @fontSizeLarge;
+  .border-radius(@borderRadiusLarge);
 }
-.btn-large [class^="icon-"] {
+.btn-large [class^="icon-"],
+.btn-large [class*=" icon-"] {
  margin-top: 2px;
 }

 // Small
 .btn-small {
-  padding: 3px 9px;
-  font-size: @baseFontSize - 2px;
-  line-height: @baseLineHeight - 2px;
+  padding: @paddingSmall;
+  font-size: @fontSizeSmall;
+  .border-radius(@borderRadiusSmall);
 }
-.btn-small [class^="icon-"] {
+.btn-small [class^="icon-"],
+.btn-small [class*=" icon-"] {
  margin-top: 0;
 }

 // Mini
 .btn-mini {
-  padding: 2px 6px;
-  font-size: @baseFontSize - 3px;
-  line-height: @baseLineHeight - 3px;
+  padding: @paddingMini;
+  font-size: @fontSizeMini;
+  .border-radius(@borderRadiusSmall);
 }


--- a/assets/css/less/code.less
+++ b/assets/css/less/code.less
@@ -35,7 +35,7 @@ pre {
  background-color: #f5f5f5;
  border: 1px solid #ccc; // fallback for IE7-8
  border: 1px solid rgba(0,0,0,.15);
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);

  // Make prettyprint styles more spaced out for readability
  &.prettyprint {
--- a/assets/css/less/dropdowns.less
+++ b/assets/css/less/dropdowns.less
@@ -72,7 +72,7 @@
  }

  // Links within the dropdown menu
-  a {
+  li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
@@ -90,7 +90,6 @@
 .dropdown-submenu:hover > a {
  text-decoration: none;
  color: @dropdownLinkColorHover;
-  background-color: @dropdownLinkBackgroundHover;
  #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
 }

@@ -98,10 +97,9 @@
 // ------------
 .dropdown-menu .active > a,
 .dropdown-menu .active > a:hover {
-  color: @dropdownLinkColorHover;
+  color: @dropdownLinkColorActive;
  text-decoration: none;
  outline: 0;
-  background-color: @dropdownLinkBackgroundActive;
  #gradient > .vertical(@dropdownLinkBackgroundActive, darken(@dropdownLinkBackgroundActive, 5%));
 }

@@ -116,6 +114,7 @@
 .dropdown-menu .disabled > a:hover {
  text-decoration: none;
  background-color: transparent;
+  background-image: none; // Remove CSS gradient
  cursor: default;
 }

@@ -163,6 +162,7 @@
 .dropdown-submenu {
  position: relative;
 }
+// Default dropdowns
 .dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
@@ -176,6 +176,18 @@
  display: block;
 }

+// Dropups
+.dropup .dropdown-submenu > .dropdown-menu {
+  top: auto;
+  bottom: 0;
+  margin-top: 0;
+  margin-bottom: -2px;
+  -webkit-border-radius: 5px 5px 5px 0;
+     -moz-border-radius: 5px 5px 5px 0;
+          border-radius: 5px 5px 5px 0;
+}
+
+// Caret to indicate there is a submenu
 .dropdown-submenu > a:after {
  display: block;
  content: " ";
@@ -193,6 +205,21 @@
  border-left-color: @dropdownLinkColorHover;
 }

+// Left aligned submenus
+.dropdown-submenu.pull-left {
+  // Undo the float
+  // Yes, this is awkward since .pull-left adds a float, but it sticks to our conventions elsewhere.
+  float: none;
+
+  // Positioning the submenu
+  > .dropdown-menu {
+    left: -100%;
+    margin-left: 10px;
+    -webkit-border-radius: 6px 0 6px 6px;
+       -moz-border-radius: 6px 0 6px 6px;
+            border-radius: 6px 0 6px 6px;
+  }
+}

 // Tweak nav headers
 // -----------------
@@ -206,5 +233,5 @@
 // ---------
 .typeahead {
  margin-top: 2px; // give it some space to breathe
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
 }
--- a/assets/css/less/forms.less
+++ b/assets/css/less/forms.less
@@ -81,11 +81,12 @@ input[type="color"],
  display: inline-block;
  height: @baseLineHeight;
  padding: 4px 6px;
-  margin-bottom: 9px;
+  margin-bottom: @baseLineHeight / 2;
  font-size: @baseFontSize;
  line-height: @baseLineHeight;
  color: @gray;
  .border-radius(@inputBorderRadius);
+  vertical-align: middle;
 }

 // Reset appearance properties for textual inputs and textarea
@@ -126,7 +127,7 @@ input[type="color"],
    border-color: rgba(82,168,236,.8);
    outline: 0;
    outline: thin dotted \9; /* IE6-9 */
-    .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6));
+    .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)");
  }
 }

@@ -154,9 +155,9 @@ input[type="checkbox"] {
 // Set the height of select and file controls to match text inputs
 select,
 input[type="file"] {
-  height: 30px; /* In IE7, the height of the select element cannot be changed by height, only font-size */
+  height: @inputHeight; /* In IE7, the height of the select element cannot be changed by height, only font-size */
  *margin-top: 4px; /* For IE7, add top margin to align select with labels */
-  line-height: 30px;
+  line-height: @inputHeight;
 }

 // Make select elements obey height by applying a border
@@ -210,7 +211,7 @@ input[type="checkbox"]:focus {
 // Placeholder
 // -------------------------

-// Placeholder text gets special styles because when browsers invalidate entire lines if it doesn’t understand a selector
+// Placeholder text gets special styles because when browsers invalidate entire lines if it doesn't understand a selector
 input,
 textarea {
  .placeholder();
@@ -223,13 +224,13 @@ textarea {
 // Indent the labels to position radios/checkboxes as hanging
 .radio,
 .checkbox {
-  min-height: 18px; // clear the floating input if there is no label text
-  padding-left: 18px;
+  min-height: @baseLineHeight; // clear the floating input if there is no label text
+  padding-left: 20px;
 }
 .radio input[type="radio"],
 .checkbox input[type="checkbox"] {
  float: left;
-  margin-left: -18px;
+  margin-left: -20px;
 }

 // Move the options list down to align with labels
@@ -304,8 +305,17 @@ textarea[class*="span"],
 .controls-row {
  .clearfix(); // Clear the float from controls
 }
-.controls-row [class*="span"] {
-  float: left; // Float to collapse white-space for proper grid alignment
+
+// Float to collapse white-space for proper grid alignment
+.controls-row [class*="span"],
+// Redeclare the fluid grid collapse since we undo the float for inputs
+.row-fluid .controls-row [class*="span"] {
+  float: left;
+}
+// Explicity set top padding on all checkboxes/radios, not just first-child
+.controls-row .checkbox[class*="span"],
+.controls-row .radio[class*="span"] {
+  padding-top: 5px;
 }


@@ -364,7 +374,8 @@ select:focus:required:invalid {
  border-color: #ee5f5b;
  &:focus {
    border-color: darken(#ee5f5b, 10%);
-    .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
+    @shadow: 0 0 6px lighten(#ee5f5b, 20%);
+    .box-shadow(@shadow);
  }
 }

@@ -413,16 +424,23 @@ select:focus:required:invalid {
 .input-append,
 .input-prepend {
  margin-bottom: 5px;
-  font-size: 0;
+  font-size: 0; // white space collapse hack
  white-space: nowrap; // Prevent span and input from separating

+  // Reset the white space collapse hack
+  input,
+  select,
+  .uneditable-input,
+  .dropdown-menu {
+    font-size: @baseFontSize;
+  }
+
  input,
  select,
  .uneditable-input {
    position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness
    margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms
    *margin-left: 0;
-    font-size: @baseFontSize;
    vertical-align: top;
    .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
    // Make input on top when focused so blue border and shadow always show
@@ -454,6 +472,7 @@ select:focus:required:invalid {
    border-color: @green;
  }
 }
+
 .input-prepend {
  .add-on,
  .btn {
@@ -461,17 +480,23 @@ select:focus:required:invalid {
  }
  .add-on:first-child,
  .btn:first-child {
+    // FYI, `.btn:first-child` accounts for a button group that's prepended
    .border-radius(@inputBorderRadius 0 0 @inputBorderRadius);
  }
 }
+
 .input-append {
  input,
  select,
  .uneditable-input {
    .border-radius(@inputBorderRadius 0 0 @inputBorderRadius);
+    + .btn-group .btn {
+      .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
+    }
  }
  .add-on,
-  .btn {
+  .btn,
+  .btn-group {
    margin-left: -1px;
  }
  .add-on:last-child,
@@ -479,12 +504,16 @@ select:focus:required:invalid {
    .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
  }
 }
+
 // Remove all border-radius for inputs with both prepend and append
 .input-prepend.input-append {
  input,
  select,
  .uneditable-input {
    .border-radius(0);
+    + .btn-group .btn {
+      .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
+    }
  }
  .add-on:first-child,
  .btn:first-child {
@@ -496,10 +525,14 @@ select:focus:required:invalid {
    margin-left: -1px;
    .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
  }
+  .btn-group:first-child {
+    margin-left: 0;
+  }
 }



+
 // SEARCH FORM
 // -----------

--- a/assets/css/less/hero-unit.less
+++ b/assets/css/less/hero-unit.less
@@ -6,6 +6,10 @@
 .hero-unit {
  padding: 60px;
  margin-bottom: 30px;
+  font-size: 18px;
+  font-weight: 200;
+  line-height: @baseLineHeight * 1.5;
+  color: @heroUnitLeadColor;
  background-color: @heroUnitBackground;
  .border-radius(6px);
  h1 {
@@ -15,10 +19,7 @@
    color: @heroUnitHeadingColor;
    letter-spacing: -1px;
  }
-  p {
-    font-size: 18px;
-    font-weight: 200;
-    line-height: @baseLineHeight * 1.5;
-    color: @heroUnitLeadColor;
+  li {
+    line-height: @baseLineHeight * 1.5; // Reset since we specify in type.less
  }
 }
--- a/assets/css/less/labels-badges.less
+++ b/assets/css/less/labels-badges.less
@@ -6,6 +6,8 @@
 // Base classes
 .label,
 .badge {
+  display: inline-block;
+  padding: 2px 4px;
  font-size: @baseFontSize * .846;
  font-weight: bold;
  line-height: 14px; // ensure proper line-height if floated
@@ -17,11 +19,11 @@
 }
 // Set unique padding and border-radii
 .label {
-  padding: 1px 4px 2px;
  .border-radius(3px);
 }
 .badge {
-  padding: 1px 9px 2px;
+  padding-left: 9px;
+  padding-right: 9px;
  .border-radius(9px);
 }

--- a/assets/css/less/media.less
+++ b/assets/css/less/media.less
@@ -0,0 +1,55 @@
+// Media objects
+// Source: http://stubbornella.org/content/?p=497
+// --------------------------------------------------
+
+
+// Common styles
+// -------------------------
+
+// Clear the floats
+.media,
+.media-body {
+  overflow: hidden;
+  *overflow: visible;
+  zoom: 1;
+}
+
+// Proper spacing between instances of .media
+.media,
+.media .media {
+  margin-top: 15px;
+}
+.media:first-child {
+  margin-top: 0;
+}
+
+// For images and videos, set to block
+.media-object {
+  display: block;
+}
+
+// Reset margins on headings for tighter default spacing
+.media-heading {
+  margin: 0 0 5px;
+}
+
+
+// Media image alignment
+// -------------------------
+
+.media .pull-left {
+  margin-right: 10px;
+}
+.media .pull-right {
+  margin-left: 10px;
+}
+
+
+// Media list variation
+// -------------------------
+
+// Undo default ul/ol styles
+.media-list {
+  margin-left: 0;
+  list-style: none;
+}
--- a/assets/css/less/mixins.less
+++ b/assets/css/less/mixins.less
@@ -154,7 +154,7 @@
 .input-block-level {
  display: block;
  width: 100%;
-  min-height: 30px;        // Make inputs at least the height of their button counterpart
+  min-height: @inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
  .box-sizing(border-box); // Makes inputs behave like true block-level elements
 }

@@ -183,7 +183,8 @@
    .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
    &:focus {
      border-color: darken(@borderColor, 10%);
-      .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%));
+      @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%);
+      .box-shadow(@shadow);
    }
  }
  // Give a small background color for input-prepend/-append
@@ -248,12 +249,10 @@
 }

 // Drop shadows
-.box-shadow(@shadowA, @shadowB:X, ...){
-  // Multiple shadow solution from http://toekneestuck.com/blog/2012/05/15/less-css-arguments-variable/
-  @props: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
-  -webkit-box-shadow: @props;
-     -moz-box-shadow: @props;
-          box-shadow: @props;
+.box-shadow(@shadow) {
+  -webkit-box-shadow: @shadow;
+     -moz-box-shadow: @shadow;
+          box-shadow: @shadow;
 }

 // Transitions
@@ -298,6 +297,7 @@
      -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twitter/bootstrap/issues/4885
       -o-transform: skew(@x, @y);
          transform: skew(@x, @y);
+  -webkit-backface-visibility: hidden; // See https://github.com/twitter/bootstrap/issues/5319
 }
 .translate3d(@x, @y, @z) {
  -webkit-transform: translate3d(@x, @y, @z);
@@ -325,7 +325,7 @@
 }

 // Background sizing
-.background-size(@size){
+.background-size(@size) {
  -webkit-background-size: @size;
     -moz-background-size: @size;
       -o-background-size: @size;
@@ -447,7 +447,7 @@
    background-repeat: no-repeat;
    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback
  }
-  .radial(@innerColor: #555, @outerColor: #333)  {
+  .radial(@innerColor: #555, @outerColor: #333) {
    background-color: @outerColor;
    background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
    background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
@@ -643,6 +643,11 @@
        margin-left: 0;
      }

+      // Space grid-sized controls properly if multiple per line
+      .controls-row [class*="span"] + [class*="span"] {
+        margin-left: @fluidGridGutterWidth;
+      }
+
      // generate .spanX and .offsetX
      .spanX (@gridColumns);
      .offsetX (@gridColumns);
--- a/assets/css/less/modals.less
+++ b/assets/css/less/modals.less
@@ -2,16 +2,6 @@
 // Modals
 // --------------------------------------------------

-
-// Recalculate z-index where appropriate,
-// but only apply to elements within modal
-.modal-open .modal {
-  .dropdown-menu {  z-index: @zindexDropdown + @zindexModal; }
-  .dropdown.open { *z-index: @zindexDropdown + @zindexModal; }
-  .popover       {  z-index: @zindexPopover  + @zindexModal; }
-  .tooltip       {  z-index: @zindexTooltip  + @zindexModal; }
-}
-
 // Background
 .modal-backdrop {
  position: fixed;
@@ -36,7 +26,6 @@
  top: 50%;
  left: 50%;
  z-index: @zindexModal;
-  overflow: auto;
  width: 560px;
  margin: -250px 0 0 -280px;
  background-color: @white;
@@ -46,6 +35,9 @@
  .border-radius(6px);
  .box-shadow(0 3px 7px rgba(0,0,0,0.3));
  .background-clip(padding-box);
+  // Remove focus outline from opened modal
+  outline: none;
+
  &.fade {
    .transition(e('opacity .3s linear, top .3s ease-out'));
    top: -25%;
@@ -95,4 +87,8 @@
  .btn-group .btn + .btn {
    margin-left: -1px;
  }
+  // and override it for block buttons as well
+  .btn-block + .btn-block {
+    margin-left: 0;
+  }
 }
--- a/assets/css/less/navbar.less
+++ b/assets/css/less/navbar.less
@@ -25,7 +25,7 @@
  padding-right: 20px;
  #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground);
  border: 1px solid @navbarBorder;
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
  .box-shadow(0 1px 4px rgba(0,0,0,.065));

  // Prevent floats from breaking the navbar
@@ -41,6 +41,7 @@
 // Override the default collapsed state
 .nav-collapse.collapse {
  height: auto;
+  overflow: visible;
 }


@@ -152,7 +153,6 @@

 .navbar-static-top {
  position: static;
-  width: 100%;
  margin-bottom: 0; // remove 18px margin for default navbar
  .navbar-inner {
    .border-radius(0);
@@ -202,7 +202,7 @@
 .navbar-fixed-top,
 .navbar-static-top {
  .navbar-inner {
-    .box-shadow(inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1));
+    .box-shadow(~"0 1px 10px rgba(0,0,0,.1)");
  }
 }

@@ -210,7 +210,7 @@
 .navbar-fixed-bottom {
  bottom: 0;
  .navbar-inner {
-    .box-shadow(inset 0 1px 0 rgba(0,0,0,.1), 0 -1px 10px rgba(0,0,0,.1));
+    .box-shadow(~"0 -1px 10px rgba(0,0,0,.1)");
  }
 }

@@ -274,7 +274,7 @@
  margin-left: 5px;
  margin-right: 5px;
  .buttonBackground(darken(@navbarBackgroundHighlight, 5%), darken(@navbarBackground, 5%));
-  .box-shadow(inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075));
+  .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)");
 }
 .navbar .btn-navbar .icon-bar {
  display: block;
@@ -446,7 +446,7 @@
      color: @white;
      background-color: @navbarInverseSearchBackground;
      border-color: @navbarInverseSearchBorder;
-      .box-shadow(inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15));
+      .box-shadow(~"inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)");
      .transition(none);
      .placeholder(@navbarInverseSearchPlaceholderColor);

--- a/assets/css/less/navs.less
+++ b/assets/css/less/navs.less
@@ -67,7 +67,8 @@
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  background-color: @linkColor;
 }
-.nav-list [class^="icon-"] {
+.nav-list [class^="icon-"],
+.nav-list [class*=" icon-"] {
  margin-right: 2px;
 }
 // Dividers (basically an hr) within the dropdown
@@ -123,7 +124,7 @@
 .nav-tabs > .active > a,
 .nav-tabs > .active > a:hover {
  color: @gray;
-  background-color: @white;
+  background-color: @bodyBackground;
  border: 1px solid #ddd;
  border-bottom-color: transparent;
  cursor: default;
--- a/assets/css/less/pager.less
+++ b/assets/css/less/pager.less
@@ -12,28 +12,29 @@
 .pager li {
  display: inline;
 }
-.pager a,
-.pager span {
+.pager li > a,
+.pager li > span {
  display: inline-block;
  padding: 5px 14px;
  background-color: #fff;
  border: 1px solid #ddd;
  .border-radius(15px);
 }
-.pager a:hover {
+.pager li > a:hover {
  text-decoration: none;
  background-color: #f5f5f5;
 }
-.pager .next a,
-.pager .next span {
+.pager .next > a,
+.pager .next > span {
  float: right;
 }
-.pager .previous a {
+.pager .previous > a,
+.pager .previous > span {
  float: left;
 }
-.pager .disabled a,
-.pager .disabled a:hover,
-.pager .disabled span {
+.pager .disabled > a,
+.pager .disabled > a:hover,
+.pager .disabled > span {
  color: @grayLight;
  background-color: #fff;
  cursor: default;
--- a/assets/css/less/pagination.less
+++ b/assets/css/less/pagination.less
@@ -2,27 +2,30 @@
 // Pagination (multiple pages)
 // --------------------------------------------------

-
+// Space out pagination from surrounding content
 .pagination {
-  height: @baseLineHeight * 2;
  margin: @baseLineHeight 0;
- }
+}
+
 .pagination ul {
+  // Allow for text-based alignment
  display: inline-block;
  .ie7-inline-block();
+  // Reset default ul styles
  margin-left: 0;
  margin-bottom: 0;
-  .border-radius(3px);
+  // Visuals
+  .border-radius(@baseBorderRadius);
  .box-shadow(0 1px 2px rgba(0,0,0,.05));
 }
 .pagination ul > li {
-  display: inline;
+  display: inline; // Remove list-style and block-level defaults
 }
 .pagination ul > li > a,
 .pagination ul > li > span {
-  float: left;
-  padding: 0 14px;
-  line-height: (@baseLineHeight * 2) - 2;
+  float: left; // Collapse white-space
+  padding: 4px 12px;
+  line-height: @baseLineHeight;
  text-decoration: none;
  background-color: @paginationBackground;
  border: 1px solid @paginationBorder;
@@ -31,7 +34,7 @@
 .pagination ul > li > a:hover,
 .pagination ul > .active > a,
 .pagination ul > .active > span {
-  background-color: #f5f5f5;
+  background-color: @paginationActiveBackground;
 }
 .pagination ul > .active > a,
 .pagination ul > .active > span {
@@ -48,17 +51,71 @@
 .pagination ul > li:first-child > a,
 .pagination ul > li:first-child > span {
  border-left-width: 1px;
-  .border-radius(3px 0 0 3px);
+  .border-left-radius(@baseBorderRadius);
 }
 .pagination ul > li:last-child > a,
 .pagination ul > li:last-child > span {
-  .border-radius(0 3px 3px 0);
+  .border-right-radius(@baseBorderRadius);
 }

-// Centered
+
+// Alignment
+// --------------------------------------------------
+
 .pagination-centered {
  text-align: center;
 }
 .pagination-right {
  text-align: right;
 }
+
+
+// Sizing
+// --------------------------------------------------
+
+// Large
+.pagination-large {
+  ul > li > a,
+  ul > li > span {
+    padding: @paddingLarge;
+    font-size: @fontSizeLarge;
+  }
+  ul > li:first-child > a,
+  ul > li:first-child > span {
+    .border-left-radius(@borderRadiusLarge);
+  }
+  ul > li:last-child > a,
+  ul > li:last-child > span {
+    .border-right-radius(@borderRadiusLarge);
+  }
+}
+
+// Small and mini
+.pagination-mini,
+.pagination-small {
+  ul > li:first-child > a,
+  ul > li:first-child > span {
+    .border-left-radius(@borderRadiusSmall);
+  }
+  ul > li:last-child > a,
+  ul > li:last-child > span {
+    .border-right-radius(@borderRadiusSmall);
+  }
+}
+
+// Small
+.pagination-small {
+  ul > li > a,
+  ul > li > span {
+    padding: @paddingSmall;
+    font-size: @fontSizeSmall;
+  }
+}
+// Mini
+.pagination-mini {
+  ul > li > a,
+  ul > li > span {
+    padding: @paddingMini;
+    font-size: @fontSizeMini;
+  }
+}
--- a/assets/css/less/popovers.less
+++ b/assets/css/less/popovers.less
@@ -21,10 +21,10 @@
  .box-shadow(0 5px 10px rgba(0,0,0,.2));

  // Offset the popover to account for the popover arrow
-  &.top     { margin-bottom: 10px; }
+  &.top     { margin-top: -10px; }
  &.right   { margin-left: 10px; }
  &.bottom  { margin-top: 10px; }
-  &.left    { margin-right: 10px; }
+  &.left    { margin-left: -10px; }

 }

--- a/assets/css/less/progress-bars.less
+++ b/assets/css/less/progress-bars.less
@@ -48,7 +48,7 @@
  margin-bottom: @baseLineHeight;
  #gradient > .vertical(#f5f5f5, #f9f9f9);
  .box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
 }

 // Bar of progress
@@ -66,7 +66,7 @@
  .transition(width .6s ease);
 }
 .progress .bar + .bar {
-  .box-shadow(inset 1px 0 0 rgba(0,0,0,.15), inset 0 -1px 0 rgba(0,0,0,.15));
+  .box-shadow(~"inset 1px 0 0 rgba(0,0,0,.15), inset 0 -1px 0 rgba(0,0,0,.15)");
 }

 // Striped bars
--- a/assets/css/less/reset.less
+++ b/assets/css/less/reset.less
@@ -88,7 +88,8 @@ img {
 }

 // Prevent max-width from affecting Google Maps
-#map_canvas img {
+#map_canvas img,
+.google-maps img {
  max-width: none;
 }

@@ -115,11 +116,11 @@ input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
  border: 0;
 }
 button,
-input[type="button"],
+html input[type="button"], // Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.
 input[type="reset"],
 input[type="submit"] {
-  cursor: pointer; // Cursors on all buttons applied consistently
-  -webkit-appearance: button; // Style clickable inputs in iOS
+    -webkit-appearance: button; // Corrects inability to style clickable `input` types in iOS.
+    cursor: pointer; // Improves usability and consistency of cursor style between image-type `input` and others.
 }
 input[type="search"] { // Appearance in Safari/Chrome
  -webkit-box-sizing: content-box;
--- a/assets/css/less/responsive-767px-max.less
+++ b/assets/css/less/responsive-767px-max.less
@@ -58,6 +58,7 @@
  }
  // Make all grid-sized elements block level again
  [class*="span"],
+  .uneditable-input[class*="span"], // Makes uneditable inputs full-width when using grid sizing
  .row-fluid [class*="span"] {
    float: none;
    display: block;
@@ -70,6 +71,9 @@
    width: 100%;
    .box-sizing(border-box);
  }
+  .row-fluid [class*="offset"]:first-child {
+		margin-left: 0;
+	}

  // FORM FIELDS
  // -----------
@@ -103,7 +107,8 @@
    right: 20px;
    width: auto;
    margin: 0;
-    &.fade.in { top: auto; }
+    &.fade  { top: -100px; }
+    &.fade.in { top: 20px; }
  }

 }
@@ -155,6 +160,20 @@
    }
  }

+  // Medias
+  // Reset float and spacing to stack
+  .media .pull-left,
+  .media .pull-right  {
+    float: none;
+    display: block;
+    margin-bottom: 10px;
+  }
+  // Remove side margins since we stack instead of indent
+  .media-object {
+    margin-right: 0;
+    margin-left: 0;
+  }
+
  // Modals
  .modal {
    top:   10px;
--- a/assets/css/less/responsive-navbar.less
+++ b/assets/css/less/responsive-navbar.less
@@ -75,7 +75,7 @@
  .nav-collapse .btn {
    padding: 4px 10px 4px;
    font-weight: normal;
-    .border-radius(4px);
+    .border-radius(@baseBorderRadius);
  }
  .nav-collapse .dropdown-menu li + li a {
    margin-bottom: 2px;
@@ -84,6 +84,10 @@
  .nav-collapse .dropdown-menu a:hover {
    background-color: @navbarBackground;
  }
+  .navbar-inverse .nav-collapse .nav > li > a,
+  .navbar-inverse .nav-collapse .dropdown-menu a {
+    color: @navbarInverseLinkColor;
+  }
  .navbar-inverse .nav-collapse .nav > li > a:hover,
  .navbar-inverse .nav-collapse .dropdown-menu a:hover {
    background-color: @navbarInverseBackground;
@@ -99,7 +103,7 @@
    top: auto;
    left: auto;
    float: none;
-    display: block;
+    display: none;
    max-width: none;
    margin: 0 15px;
    padding: 0;
@@ -108,6 +112,10 @@
    .border-radius(0);
    .box-shadow(none);
  }
+  .nav-collapse .open > .dropdown-menu { 
+    display: block; 
+  }
+
  .nav-collapse .dropdown-menu:before,
  .nav-collapse .dropdown-menu:after {
    display: none;
@@ -129,7 +137,7 @@
    margin: (@baseLineHeight / 2) 0;
    border-top: 1px solid @navbarBackground;
    border-bottom: 1px solid @navbarBackground;
-    .box-shadow(inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1));
+    .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1)");
  }
  .navbar-inverse .nav-collapse .navbar-form,
  .navbar-inverse .nav-collapse .navbar-search {
@@ -166,7 +174,7 @@
 // DEFAULT DESKTOP
 // ---------------

-@media (min-width: 980px) {
+@media (min-width: @navbarCollapseDesktopWidth) {

  // Required to make the collapsing navbar work on regular desktops
  .nav-collapse.collapse {
--- a/assets/css/less/responsive.less
+++ b/assets/css/less/responsive.less
@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Responsive v2.1.1
+ * Bootstrap Responsive v2.2.0
 *
 * Copyright 2012 Twitter, Inc
 * Licensed under the Apache License v2.0
--- a/assets/css/less/sprites.less
+++ b/assets/css/less/sprites.less
@@ -30,8 +30,6 @@

 /* White icons with optional class, or on hover/active states of certain elements */
 .icon-white,
-.nav-tabs > .active > a > [class^="icon-"],
-.nav-tabs > .active > a > [class*=" icon-"],
 .nav-pills > .active > a > [class^="icon-"],
 .nav-pills > .active > a > [class*=" icon-"],
 .nav-list > .active > a > [class^="icon-"],
@@ -41,7 +39,9 @@
 .dropdown-menu > li > a:hover > [class^="icon-"],
 .dropdown-menu > li > a:hover > [class*=" icon-"],
 .dropdown-menu > .active > a > [class^="icon-"],
-.dropdown-menu > .active > a > [class*=" icon-"] {
+.dropdown-menu > .active > a > [class*=" icon-"],
+.dropdown-submenu:hover > a > [class^="icon-"],
+.dropdown-submenu:hover > a > [class*=" icon-"] {
  background-image: url("@{iconWhiteSpritePath}");
 }

--- a/assets/css/less/tables.less
+++ b/assets/css/less/tables.less
@@ -71,7 +71,7 @@ table {
  border-collapse: separate; // Done so we can round those corners!
  *border-collapse: collapse; // IE7 can't round corners anyway
  border-left: 0;
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
  th,
  td {
    border-left: 1px solid @tableBorder;
@@ -133,7 +133,7 @@ table {
  colgroup + tbody tr:first-child td:last-child {
    -webkit-border-top-right-radius: 4px;
            border-top-right-radius: 4px;
-         -moz-border-radius-topleft: 4px;
+        -moz-border-radius-topright: 4px;
  }

 }
@@ -172,39 +172,30 @@ table {
 // -----------------

 // Reset default grid behavior
-table [class*=span],
-.row-fluid table [class*=span] {
+table td[class*="span"],
+table th[class*="span"],
+.row-fluid table td[class*="span"],
+.row-fluid table th[class*="span"] {
  display: table-cell;
  float: none; // undo default grid column styles
  margin-left: 0; // undo default grid column styles
 }

 // Change the column widths to account for td/th padding
-.table {
-  .span1     { .tableColumns(1); }
-  .span2     { .tableColumns(2); }
-  .span3     { .tableColumns(3); }
-  .span4     { .tableColumns(4); }
-  .span5     { .tableColumns(5); }
-  .span6     { .tableColumns(6); }
-  .span7     { .tableColumns(7); }
-  .span8     { .tableColumns(8); }
-  .span9     { .tableColumns(9); }
-  .span10    { .tableColumns(10); }
-  .span11    { .tableColumns(11); }
-  .span12    { .tableColumns(12); }
-  .span13    { .tableColumns(13); }
-  .span14    { .tableColumns(14); }
-  .span15    { .tableColumns(15); }
-  .span16    { .tableColumns(16); }
-  .span17    { .tableColumns(17); }
-  .span18    { .tableColumns(18); }
-  .span19    { .tableColumns(19); }
-  .span20    { .tableColumns(20); }
-  .span21    { .tableColumns(21); }
-  .span22    { .tableColumns(22); }
-  .span23    { .tableColumns(23); }
-  .span24    { .tableColumns(24); }
+.table td,
+.table th {
+  &.span1     { .tableColumns(1); }
+  &.span2     { .tableColumns(2); }
+  &.span3     { .tableColumns(3); }
+  &.span4     { .tableColumns(4); }
+  &.span5     { .tableColumns(5); }
+  &.span6     { .tableColumns(6); }
+  &.span7     { .tableColumns(7); }
+  &.span8     { .tableColumns(8); }
+  &.span9     { .tableColumns(9); }
+  &.span10    { .tableColumns(10); }
+  &.span11    { .tableColumns(11); }
+  &.span12    { .tableColumns(12); }
 }


--- a/assets/css/less/thumbnails.less
+++ b/assets/css/less/thumbnails.less
@@ -29,7 +29,7 @@
  padding: 4px;
  line-height: @baseLineHeight;
  border: 1px solid #ddd;
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
  .box-shadow(0 1px 3px rgba(0,0,0,.055));
  .transition(all .2s ease-in-out);
 }
--- a/assets/css/less/tooltip.less
+++ b/assets/css/less/tooltip.less
@@ -27,7 +27,7 @@
  text-align: center;
  text-decoration: none;
  background-color: @tooltipBackground;
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
 }

 // Arrows
--- a/assets/css/less/type.less
+++ b/assets/css/less/type.less
@@ -37,18 +37,17 @@ cite {
 .muted {
  color: @grayLight;
 }
-.text-warning {
-  color: @warningText;
-}
-.text-error {
-  color: @errorText;
-}
-.text-info {
-  color: @infoText;
-}
-.text-success {
-  color: @successText;
-}
+.text-warning { color: @warningText; }
+a.text-warning:hover { color: darken(@warningText, 10%); }
+
+.text-error { color: @errorText; }
+a.text-error:hover { color: darken(@errorText, 10%); }
+
+.text-info { color: @infoText; }
+a.text-info:hover { color: darken(@infoText, 10%); }
+
+.text-success { color: @successText; }
+a.text-success:hover { color: darken(@successText, 10%); }


 // Headings
@@ -58,7 +57,7 @@ h1, h2, h3, h4, h5, h6 {
  margin: (@baseLineHeight / 2) 0;
  font-family: @headingsFontFamily;
  font-weight: @headingsFontWeight;
-  line-height: 1;
+  line-height: @baseLineHeight;
  color: @headingsColor;
  text-rendering: optimizelegibility; // Fix the character spacing for headings
  small {
@@ -67,17 +66,22 @@ h1, h2, h3, h4, h5, h6 {
    color: @grayLight;
  }
 }
-h1 { font-size: 36px; line-height: 40px; }
-h2 { font-size: 30px; line-height: 40px; }
-h3 { font-size: 24px; line-height: 40px; }
-h4 { font-size: 18px; line-height: 20px; }
-h5 { font-size: 14px; line-height: 20px; }
-h6 { font-size: 12px; line-height: 20px; }

-h1 small { font-size: 24px; }
-h2 small { font-size: 18px; }
-h3 small { font-size: 14px; }
-h4 small { font-size: 14px; }
+h1,
+h2,
+h3 { line-height: @baseLineHeight * 2; }
+
+h1 { font-size: @baseFontSize * 2.75; } // ~38px
+h2 { font-size: @baseFontSize * 2.25; } // ~32px
+h3 { font-size: @baseFontSize * 1.75; } // ~24px
+h4 { font-size: @baseFontSize * 1.25; } // ~18px
+h5 { font-size: @baseFontSize; }
+h6 { font-size: @baseFontSize * 0.85; } // ~12px
+
+h1 small { font-size: @baseFontSize * 1.75; } // ~24px
+h2 small { font-size: @baseFontSize * 1.25; } // ~18px
+h3 small { font-size: @baseFontSize; }
+h4 small { font-size: @baseFontSize; }


 // Page header
@@ -155,7 +159,9 @@ hr {
 }

 // Abbreviations and acronyms
-abbr[title] {
+abbr[title],
+// Added data-* attribute to help out our tooltip plugin, per https://github.com/twitter/bootstrap/issues/5257
+abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted @grayLight;
 }
--- a/assets/css/less/variables.less
+++ b/assets/css/less/variables.less
@@ -57,6 +57,24 @@
@headingsFontWeight:    bold;    // instead of browser default, bold
@headingsColor:         inherit; // empty to use BS default, @textColor

+
+// Component sizing
+// -------------------------
+// Based on 14px font-size and 20px line-height
+
+@fontSizeLarge:         @baseFontSize * 1.25; // ~18px
+@fontSizeSmall:         @baseFontSize * 0.85; // ~12px
+@fontSizeMini:          @baseFontSize * 0.75; // ~11px
+
+@paddingLarge:          11px 19px; // 44px
+@paddingSmall:          2px 10px;  // 26px
+@paddingMini:           1px 6px;   // 24px
+
+@baseBorderRadius:      4px;
+@borderRadiusLarge:     6px;
+@borderRadiusSmall:     3px;
+
+
 // Tables
 // -------------------------
@tableBackground:                   transparent; // overall background-color
@@ -93,9 +111,11 @@
 // -------------------------
@inputBackground:               @white;
@inputBorder:                   #ccc;
-@inputBorderRadius:             3px;
+@inputBorderRadius:             @baseBorderRadius;
@inputDisabledBackground:       @grayLighter;
@formActionsBackground:         #f5f5f5;
+@inputHeight:                   @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
+

 // Dropdowns
 // -------------------------
@@ -116,6 +136,7 @@
 // COMPONENT VARIABLES
 // --------------------------------------------------

+
 // Z-index master list
 // -------------------------
 // Used for a bird's eye view of components dependent on the z-axis
@@ -157,6 +178,7 @@
 // Navbar
 // -------------------------
@navbarCollapseWidth:             979px;
+@navbarCollapseDesktopWidth:      @navbarCollapseWidth + 1;

@navbarHeight:                    40px;
@navbarBackgroundHighlight:       #ffffff;
--- a/assets/css/less/wells.less
+++ b/assets/css/less/wells.less
@@ -10,7 +10,7 @@
  margin-bottom: 20px;
  background-color: @wellBackground;
  border: 1px solid darken(@wellBackground, 7%);
-  .border-radius(4px);
+  .border-radius(@baseBorderRadius);
  .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
  blockquote {
    border-color: #ddd;
@@ -21,9 +21,9 @@
 // Sizes
 .well-large {
  padding: 24px;
-  .border-radius(6px);
+  .border-radius(@borderRadiusLarge);
 }
 .well-small {
  padding: 9px;
-  .border-radius(3px);
+  .border-radius(@borderRadiusSmall);
 }
--- a/assets/js/plugins.js
+++ b/assets/js/plugins.js