couchdb-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From ryanram...@apache.org
Subject [10/51] [partial] Restructure to simpler jam/erica style.
Date Sat, 11 May 2013 05:48:23 GMT
http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/responsive-767px-max.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/responsive-767px-max.less b/src/fauxton/jam/bootstrap/less/responsive-767px-max.less
new file mode 100644
index 0000000..1d5c123
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/responsive-767px-max.less
@@ -0,0 +1,193 @@
+//
+// Responsive: Landscape phone to desktop/tablet
+// --------------------------------------------------
+
+
+@media (max-width: 767px) {
+
+  // Padding to set content in a bit
+  body {
+    padding-left: 20px;
+    padding-right: 20px;
+  }
+  // Negative indent the now static "fixed" navbar
+  .navbar-fixed-top,
+  .navbar-fixed-bottom,
+  .navbar-static-top {
+    margin-left: -20px;
+    margin-right: -20px;
+  }
+  // Remove padding on container given explicit padding set on body
+  .container-fluid {
+    padding: 0;
+  }
+
+  // TYPOGRAPHY
+  // ----------
+  // Reset horizontal dl
+  .dl-horizontal {
+    dt {
+      float: none;
+      clear: none;
+      width: auto;
+      text-align: left;
+    }
+    dd {
+      margin-left: 0;
+    }
+  }
+
+  // GRID & CONTAINERS
+  // -----------------
+  // Remove width from containers
+  .container {
+    width: auto;
+  }
+  // Fluid rows
+  .row-fluid {
+    width: 100%;
+  }
+  // Undo negative margin on rows and thumbnails
+  .row,
+  .thumbnails {
+    margin-left: 0;
+  }
+  .thumbnails > li {
+    float: none;
+    margin-left: 0; // Reset the default margin for all li elements when no .span* classes are present
+  }
+  // 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;
+    width: 100%;
+    margin-left: 0;
+    .box-sizing(border-box);
+  }
+  .span12,
+  .row-fluid .span12 {
+    width: 100%;
+    .box-sizing(border-box);
+  }
+  .row-fluid [class*="offset"]:first-child {
+		margin-left: 0;
+	}
+
+  // FORM FIELDS
+  // -----------
+  // Make span* classes full width
+  .input-large,
+  .input-xlarge,
+  .input-xxlarge,
+  input[class*="span"],
+  select[class*="span"],
+  textarea[class*="span"],
+  .uneditable-input {
+    .input-block-level();
+  }
+  // But don't let it screw up prepend/append inputs
+  .input-prepend input,
+  .input-append input,
+  .input-prepend input[class*="span"],
+  .input-append input[class*="span"] {
+    display: inline-block; // redeclare so they don't wrap to new lines
+    width: auto;
+  }
+  .controls-row [class*="span"] + [class*="span"] {
+    margin-left: 0;
+  }
+
+  // Modals
+  .modal {
+    position: fixed;
+    top:   20px;
+    left:  20px;
+    right: 20px;
+    width: auto;
+    margin: 0;
+    &.fade  { top: -100px; }
+    &.fade.in { top: 20px; }
+  }
+
+}
+
+
+
+// UP TO LANDSCAPE PHONE
+// ---------------------
+
+@media (max-width: 480px) {
+
+  // Smooth out the collapsing/expanding nav
+  .nav-collapse {
+    -webkit-transform: translate3d(0, 0, 0); // activate the GPU
+  }
+
+  // Block level the page header small tag for readability
+  .page-header h1 small {
+    display: block;
+    line-height: @baseLineHeight;
+  }
+
+  // Update checkboxes for iOS
+  input[type="checkbox"],
+  input[type="radio"] {
+    border: 1px solid #ccc;
+  }
+
+  // Remove the horizontal form styles
+  .form-horizontal {
+    .control-label {
+      float: none;
+      width: auto;
+      padding-top: 0;
+      text-align: left;
+    }
+    // Move over all input controls and content
+    .controls {
+      margin-left: 0;
+    }
+    // Move the options list down to align with labels
+    .control-list {
+      padding-top: 0; // has to be padding because margin collaspes
+    }
+    // Move over buttons in .form-actions to align with .controls
+    .form-actions {
+      padding-left: 10px;
+      padding-right: 10px;
+    }
+  }
+
+  // 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;
+    left:  10px;
+    right: 10px;
+  }
+  .modal-header .close {
+    padding: 10px;
+    margin: -10px;
+  }
+
+  // Carousel
+  .carousel-caption {
+    position: static;
+  }
+
+}

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/responsive-768px-979px.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/responsive-768px-979px.less b/src/fauxton/jam/bootstrap/less/responsive-768px-979px.less
new file mode 100644
index 0000000..8e8c486
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/responsive-768px-979px.less
@@ -0,0 +1,19 @@
+//
+// Responsive: Tablet to desktop
+// --------------------------------------------------
+
+
+@media (min-width: 768px) and (max-width: 979px) {
+
+  // Fixed grid
+  #grid > .core(@gridColumnWidth768, @gridGutterWidth768);
+
+  // Fluid grid
+  #grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768);
+
+  // Input grid
+  #grid > .input(@gridColumnWidth768, @gridGutterWidth768);
+
+  // No need to reset .thumbnails here since it's the same @gridGutterWidth
+
+}

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/responsive-navbar.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/responsive-navbar.less b/src/fauxton/jam/bootstrap/less/responsive-navbar.less
new file mode 100644
index 0000000..2a0b0c0
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/responsive-navbar.less
@@ -0,0 +1,185 @@
+//
+// Responsive: Navbar
+// --------------------------------------------------
+
+
+// TABLETS AND BELOW
+// -----------------
+@media (max-width: @navbarCollapseWidth) {
+
+  // UNFIX THE TOPBAR
+  // ----------------
+  // Remove any padding from the body
+  body {
+    padding-top: 0;
+  }
+  // Unfix the navbars
+  .navbar-fixed-top,
+  .navbar-fixed-bottom {
+    position: static;
+  }
+  .navbar-fixed-top {
+    margin-bottom: @baseLineHeight;
+  }
+  .navbar-fixed-bottom {
+    margin-top: @baseLineHeight;
+  }
+  .navbar-fixed-top .navbar-inner,
+  .navbar-fixed-bottom .navbar-inner {
+    padding: 5px;
+  }
+  .navbar .container {
+    width: auto;
+    padding: 0;
+  }
+  // Account for brand name
+  .navbar .brand {
+    padding-left: 10px;
+    padding-right: 10px;
+    margin: 0 0 0 -5px;
+  }
+
+  // COLLAPSIBLE NAVBAR
+  // ------------------
+  // Nav collapse clears brand
+  .nav-collapse {
+    clear: both;
+  }
+  // Block-level the nav
+  .nav-collapse .nav {
+    float: none;
+    margin: 0 0 (@baseLineHeight / 2);
+  }
+  .nav-collapse .nav > li {
+    float: none;
+  }
+  .nav-collapse .nav > li > a {
+    margin-bottom: 2px;
+  }
+  .nav-collapse .nav > .divider-vertical {
+    display: none;
+  }
+  .nav-collapse .nav .nav-header {
+    color: @navbarText;
+    text-shadow: none;
+  }
+  // Nav and dropdown links in navbar
+  .nav-collapse .nav > li > a,
+  .nav-collapse .dropdown-menu a {
+    padding: 9px 15px;
+    font-weight: bold;
+    color: @navbarLinkColor;
+    .border-radius(3px);
+  }
+  // Buttons
+  .nav-collapse .btn {
+    padding: 4px 10px 4px;
+    font-weight: normal;
+    .border-radius(@baseBorderRadius);
+  }
+  .nav-collapse .dropdown-menu li + li a {
+    margin-bottom: 2px;
+  }
+  .nav-collapse .nav > li > a:hover,
+  .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;
+  }
+  // Buttons in the navbar
+  .nav-collapse.in .btn-group {
+    margin-top: 5px;
+    padding: 0;
+  }
+  // Dropdowns in the navbar
+  .nav-collapse .dropdown-menu {
+    position: static;
+    top: auto;
+    left: auto;
+    float: none;
+    display: none;
+    max-width: none;
+    margin: 0 15px;
+    padding: 0;
+    background-color: transparent;
+    border: none;
+    .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;
+  }
+  .nav-collapse .dropdown-menu .divider {
+    display: none;
+  }
+  .nav-collapse .nav > li > .dropdown-menu {
+    &:before,
+    &:after {
+      display: none;
+    }
+  }
+  // Forms in navbar
+  .nav-collapse .navbar-form,
+  .nav-collapse .navbar-search {
+    float: none;
+    padding: (@baseLineHeight / 2) 15px;
+    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)");
+  }
+  .navbar-inverse .nav-collapse .navbar-form,
+  .navbar-inverse .nav-collapse .navbar-search {
+    border-top-color: @navbarInverseBackground;
+    border-bottom-color: @navbarInverseBackground;
+  }
+  // Pull right (secondary) nav content
+  .navbar .nav-collapse .nav.pull-right {
+    float: none;
+    margin-left: 0;
+  }
+  // Hide everything in the navbar save .brand and toggle button */
+  .nav-collapse,
+  .nav-collapse.collapse {
+    overflow: hidden;
+    height: 0;
+  }
+  // Navbar button
+  .navbar .btn-navbar {
+    display: block;
+  }
+
+  // STATIC NAVBAR
+  // -------------
+  .navbar-static .navbar-inner {
+    padding-left:  10px;
+    padding-right: 10px;
+  }
+
+
+}
+
+
+// DEFAULT DESKTOP
+// ---------------
+
+@media (min-width: @navbarCollapseDesktopWidth) {
+
+  // Required to make the collapsing navbar work on regular desktops
+  .nav-collapse.collapse {
+    height: auto !important;
+    overflow: visible !important;
+  }
+
+}

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/responsive-utilities.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/responsive-utilities.less b/src/fauxton/jam/bootstrap/less/responsive-utilities.less
new file mode 100644
index 0000000..2c3f6c1
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/responsive-utilities.less
@@ -0,0 +1,43 @@
+//
+// Responsive: Utility classes
+// --------------------------------------------------
+
+
+// Hide from screenreaders and browsers
+// Credit: HTML5 Boilerplate
+.hidden {
+  display: none;
+  visibility: hidden;
+}
+
+// Visibility utilities
+
+// For desktops
+.visible-phone     { display: none !important; }
+.visible-tablet    { display: none !important; }
+.hidden-phone      { }
+.hidden-tablet     { }
+.hidden-desktop    { display: none !important; }
+.visible-desktop   { display: inherit !important; }
+
+// Tablets & small desktops only
+@media (min-width: 768px) and (max-width: 979px) {
+  // Hide everything else
+  .hidden-desktop    { display: inherit !important; }
+  .visible-desktop   { display: none !important ; }
+  // Show
+  .visible-tablet    { display: inherit !important; }
+  // Hide
+  .hidden-tablet     { display: none !important; }
+}
+
+// Phones only
+@media (max-width: 767px) {
+  // Hide everything else
+  .hidden-desktop    { display: inherit !important; }
+  .visible-desktop   { display: none !important; }
+  // Show
+  .visible-phone     { display: inherit !important; } // Use inherit to restore previous behavior
+  // Hide
+  .hidden-phone      { display: none !important; }
+}

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/responsive.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/responsive.less b/src/fauxton/jam/bootstrap/less/responsive.less
new file mode 100644
index 0000000..7cfaf80
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/responsive.less
@@ -0,0 +1,57 @@
+/*!
+ * Bootstrap Responsive v2.2.2
+ *
+ * Copyright 2012 Twitter, Inc
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Designed and built with all the love in the world @twitter by @mdo and @fat.
+ */
+
+
+// Responsive.less
+// For phone and tablet devices
+// -------------------------------------------------------------
+
+
+// IE10 Metro responsive
+// Required for Windows 8 Metro split-screen snapping with IE10
+// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
+
+@-ms-viewport{
+  width: device-width;
+}
+
+
+// REPEAT VARIABLES & MIXINS
+// -------------------------
+// Required since we compile the responsive stuff separately
+
+@import "variables.less"; // Modify this for custom colors, font-sizes, etc
+@import "mixins.less";
+
+
+// RESPONSIVE CLASSES
+// ------------------
+
+@import "responsive-utilities.less";
+
+
+// MEDIA QUERIES
+// ------------------
+
+// Large desktops
+@import "responsive-1200px-min.less";
+
+// Tablets to regular desktops
+@import "responsive-768px-979px.less";
+
+// Phones to portrait tablets and narrow desktops
+@import "responsive-767px-max.less";
+
+
+// RESPONSIVE NAVBAR
+// ------------------
+
+// From 979px and below, show a button to toggle navbar contents
+@import "responsive-navbar.less";

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/scaffolding.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/scaffolding.less b/src/fauxton/jam/bootstrap/less/scaffolding.less
new file mode 100644
index 0000000..7a7496a
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/scaffolding.less
@@ -0,0 +1,52 @@
+//
+// Scaffolding
+// --------------------------------------------------
+
+
+// Body reset
+// -------------------------
+
+body {
+  margin: 0;
+  font-family: @baseFontFamily;
+  font-size: @baseFontSize;
+  line-height: @baseLineHeight;
+  color: @textColor;
+  background-color: @bodyBackground;
+}
+
+
+// Links
+// -------------------------
+
+a {
+  color: @linkColor;
+  text-decoration: none;
+}
+a:hover {
+  color: @linkColorHover;
+  text-decoration: underline;
+}
+
+
+// Images
+// -------------------------
+
+// Rounded corners
+.img-rounded {
+  .border-radius(6px);
+}
+
+// Add polaroid-esque trim
+.img-polaroid {
+  padding: 4px;
+  background-color: #fff;
+  border: 1px solid #ccc;
+  border: 1px solid rgba(0,0,0,.2);
+  .box-shadow(0 1px 3px rgba(0,0,0,.1));
+}
+
+// Perfect circle
+.img-circle {
+  .border-radius(500px); // crank the border-radius so it works with most reasonably sized images
+}

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/sprites.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/sprites.less b/src/fauxton/jam/bootstrap/less/sprites.less
new file mode 100644
index 0000000..9cd2ae3
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/sprites.less
@@ -0,0 +1,193 @@
+//
+// Sprites
+// --------------------------------------------------
+
+
+// ICONS
+// -----
+
+// All icons receive the styles of the <i> tag with a base class
+// of .i and are then given a unique class to add width, height,
+// and background-position. Your resulting HTML will look like
+// <i class="icon-inbox"></i>.
+
+// For the white version of the icons, just add the .icon-white class:
+// <i class="icon-inbox icon-white"></i>
+
+[class^="icon-"],
+[class*=" icon-"] {
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  .ie7-restore-right-whitespace();
+  line-height: 14px;
+  vertical-align: text-top;
+  background-image: url("@{iconSpritePath}");
+  background-position: 14px 14px;
+  background-repeat: no-repeat;
+  margin-top: 1px;
+}
+
+/* White icons with optional class, or on hover/active states of certain elements */
+.icon-white,
+.nav-pills > .active > a > [class^="icon-"],
+.nav-pills > .active > a > [class*=" icon-"],
+.nav-list > .active > a > [class^="icon-"],
+.nav-list > .active > a > [class*=" icon-"],
+.navbar-inverse .nav > .active > a > [class^="icon-"],
+.navbar-inverse .nav > .active > a > [class*=" icon-"],
+.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-submenu:hover > a > [class^="icon-"],
+.dropdown-submenu:hover > a > [class*=" icon-"] {
+  background-image: url("@{iconWhiteSpritePath}");
+}
+
+.icon-glass              { background-position: 0      0; }
+.icon-music              { background-position: -24px  0; }
+.icon-search             { background-position: -48px  0; }
+.icon-envelope           { background-position: -72px  0; }
+.icon-heart              { background-position: -96px  0; }
+.icon-star               { background-position: -120px 0; }
+.icon-star-empty         { background-position: -144px 0; }
+.icon-user               { background-position: -168px 0; }
+.icon-film               { background-position: -192px 0; }
+.icon-th-large           { background-position: -216px 0; }
+.icon-th                 { background-position: -240px 0; }
+.icon-th-list            { background-position: -264px 0; }
+.icon-ok                 { background-position: -288px 0; }
+.icon-remove             { background-position: -312px 0; }
+.icon-zoom-in            { background-position: -336px 0; }
+.icon-zoom-out           { background-position: -360px 0; }
+.icon-off                { background-position: -384px 0; }
+.icon-signal             { background-position: -408px 0; }
+.icon-cog                { background-position: -432px 0; }
+.icon-trash              { background-position: -456px 0; }
+
+.icon-home               { background-position: 0      -24px; }
+.icon-file               { background-position: -24px  -24px; }
+.icon-time               { background-position: -48px  -24px; }
+.icon-road               { background-position: -72px  -24px; }
+.icon-download-alt       { background-position: -96px  -24px; }
+.icon-download           { background-position: -120px -24px; }
+.icon-upload             { background-position: -144px -24px; }
+.icon-inbox              { background-position: -168px -24px; }
+.icon-play-circle        { background-position: -192px -24px; }
+.icon-repeat             { background-position: -216px -24px; }
+.icon-refresh            { background-position: -240px -24px; }
+.icon-list-alt           { background-position: -264px -24px; }
+.icon-lock               { background-position: -287px -24px; } // 1px off
+.icon-flag               { background-position: -312px -24px; }
+.icon-headphones         { background-position: -336px -24px; }
+.icon-volume-off         { background-position: -360px -24px; }
+.icon-volume-down        { background-position: -384px -24px; }
+.icon-volume-up          { background-position: -408px -24px; }
+.icon-qrcode             { background-position: -432px -24px; }
+.icon-barcode            { background-position: -456px -24px; }
+
+.icon-tag                { background-position: 0      -48px; }
+.icon-tags               { background-position: -25px  -48px; } // 1px off
+.icon-book               { background-position: -48px  -48px; }
+.icon-bookmark           { background-position: -72px  -48px; }
+.icon-print              { background-position: -96px  -48px; }
+.icon-camera             { background-position: -120px -48px; }
+.icon-font               { background-position: -144px -48px; }
+.icon-bold               { background-position: -167px -48px; } // 1px off
+.icon-italic             { background-position: -192px -48px; }
+.icon-text-height        { background-position: -216px -48px; }
+.icon-text-width         { background-position: -240px -48px; }
+.icon-align-left         { background-position: -264px -48px; }
+.icon-align-center       { background-position: -288px -48px; }
+.icon-align-right        { background-position: -312px -48px; }
+.icon-align-justify      { background-position: -336px -48px; }
+.icon-list               { background-position: -360px -48px; }
+.icon-indent-left        { background-position: -384px -48px; }
+.icon-indent-right       { background-position: -408px -48px; }
+.icon-facetime-video     { background-position: -432px -48px; }
+.icon-picture            { background-position: -456px -48px; }
+
+.icon-pencil             { background-position: 0      -72px; }
+.icon-map-marker         { background-position: -24px  -72px; }
+.icon-adjust             { background-position: -48px  -72px; }
+.icon-tint               { background-position: -72px  -72px; }
+.icon-edit               { background-position: -96px  -72px; }
+.icon-share              { background-position: -120px -72px; }
+.icon-check              { background-position: -144px -72px; }
+.icon-move               { background-position: -168px -72px; }
+.icon-step-backward      { background-position: -192px -72px; }
+.icon-fast-backward      { background-position: -216px -72px; }
+.icon-backward           { background-position: -240px -72px; }
+.icon-play               { background-position: -264px -72px; }
+.icon-pause              { background-position: -288px -72px; }
+.icon-stop               { background-position: -312px -72px; }
+.icon-forward            { background-position: -336px -72px; }
+.icon-fast-forward       { background-position: -360px -72px; }
+.icon-step-forward       { background-position: -384px -72px; }
+.icon-eject              { background-position: -408px -72px; }
+.icon-chevron-left       { background-position: -432px -72px; }
+.icon-chevron-right      { background-position: -456px -72px; }
+
+.icon-plus-sign          { background-position: 0      -96px; }
+.icon-minus-sign         { background-position: -24px  -96px; }
+.icon-remove-sign        { background-position: -48px  -96px; }
+.icon-ok-sign            { background-position: -72px  -96px; }
+.icon-question-sign      { background-position: -96px  -96px; }
+.icon-info-sign          { background-position: -120px -96px; }
+.icon-screenshot         { background-position: -144px -96px; }
+.icon-remove-circle      { background-position: -168px -96px; }
+.icon-ok-circle          { background-position: -192px -96px; }
+.icon-ban-circle         { background-position: -216px -96px; }
+.icon-arrow-left         { background-position: -240px -96px; }
+.icon-arrow-right        { background-position: -264px -96px; }
+.icon-arrow-up           { background-position: -289px -96px; } // 1px off
+.icon-arrow-down         { background-position: -312px -96px; }
+.icon-share-alt          { background-position: -336px -96px; }
+.icon-resize-full        { background-position: -360px -96px; }
+.icon-resize-small       { background-position: -384px -96px; }
+.icon-plus               { background-position: -408px -96px; }
+.icon-minus              { background-position: -433px -96px; }
+.icon-asterisk           { background-position: -456px -96px; }
+
+.icon-exclamation-sign   { background-position: 0      -120px; }
+.icon-gift               { background-position: -24px  -120px; }
+.icon-leaf               { background-position: -48px  -120px; }
+.icon-fire               { background-position: -72px  -120px; }
+.icon-eye-open           { background-position: -96px  -120px; }
+.icon-eye-close          { background-position: -120px -120px; }
+.icon-warning-sign       { background-position: -144px -120px; }
+.icon-plane              { background-position: -168px -120px; }
+.icon-calendar           { background-position: -192px -120px; }
+.icon-random             { background-position: -216px -120px; width: 16px; }
+.icon-comment            { background-position: -240px -120px; }
+.icon-magnet             { background-position: -264px -120px; }
+.icon-chevron-up         { background-position: -288px -120px; }
+.icon-chevron-down       { background-position: -313px -119px; } // 1px, 1px off
+.icon-retweet            { background-position: -336px -120px; }
+.icon-shopping-cart      { background-position: -360px -120px; }
+.icon-folder-close       { background-position: -384px -120px; }
+.icon-folder-open        { background-position: -408px -120px; width: 16px; }
+.icon-resize-vertical    { background-position: -432px -119px; } // 1px, 1px off
+.icon-resize-horizontal  { background-position: -456px -118px; } // 1px, 2px off
+
+.icon-hdd                     { background-position: 0      -144px; }
+.icon-bullhorn                { background-position: -24px  -144px; }
+.icon-bell                    { background-position: -48px  -144px; }
+.icon-certificate             { background-position: -72px  -144px; }
+.icon-thumbs-up               { background-position: -96px  -144px; }
+.icon-thumbs-down             { background-position: -120px -144px; }
+.icon-hand-right              { background-position: -144px -144px; }
+.icon-hand-left               { background-position: -168px -144px; }
+.icon-hand-up                 { background-position: -192px -144px; }
+.icon-hand-down               { background-position: -216px -144px; }
+.icon-circle-arrow-right      { background-position: -240px -144px; }
+.icon-circle-arrow-left       { background-position: -264px -144px; }
+.icon-circle-arrow-up         { background-position: -288px -144px; }
+.icon-circle-arrow-down       { background-position: -312px -144px; }
+.icon-globe                   { background-position: -336px -144px; }
+.icon-wrench                  { background-position: -360px -144px; }
+.icon-tasks                   { background-position: -384px -144px; }
+.icon-filter                  { background-position: -408px -144px; }
+.icon-briefcase               { background-position: -432px -144px; }
+.icon-fullscreen              { background-position: -456px -144px; }

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/tables.less
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/tables.less b/src/fauxton/jam/bootstrap/less/tables.less
new file mode 100644
index 0000000..f3b9967
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/tables.less
@@ -0,0 +1,237 @@
+//
+// Tables
+// --------------------------------------------------
+
+
+// BASE TABLES
+// -----------------
+
+table {
+  max-width: 100%;
+  background-color: @tableBackground;
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+// BASELINE STYLES
+// ---------------
+
+.table {
+  width: 100%;
+  margin-bottom: @baseLineHeight;
+  // Cells
+  th,
+  td {
+    padding: 8px;
+    line-height: @baseLineHeight;
+    text-align: left;
+    vertical-align: top;
+    border-top: 1px solid @tableBorder;
+  }
+  th {
+    font-weight: bold;
+  }
+  // Bottom align for column headings
+  thead th {
+    vertical-align: bottom;
+  }
+  // Remove top border from thead by default
+  caption + thead tr:first-child th,
+  caption + thead tr:first-child td,
+  colgroup + thead tr:first-child th,
+  colgroup + thead tr:first-child td,
+  thead:first-child tr:first-child th,
+  thead:first-child tr:first-child td {
+    border-top: 0;
+  }
+  // Account for multiple tbody instances
+  tbody + tbody {
+    border-top: 2px solid @tableBorder;
+  }
+
+  // Nesting
+  .table {
+    background-color: @bodyBackground;
+  }
+}
+
+
+
+// CONDENSED TABLE W/ HALF PADDING
+// -------------------------------
+
+.table-condensed {
+  th,
+  td {
+    padding: 4px 5px;
+  }
+}
+
+
+// BORDERED VERSION
+// ----------------
+
+.table-bordered {
+  border: 1px solid @tableBorder;
+  border-collapse: separate; // Done so we can round those corners!
+  *border-collapse: collapse; // IE7 can't round corners anyway
+  border-left: 0;
+  .border-radius(@baseBorderRadius);
+  th,
+  td {
+    border-left: 1px solid @tableBorder;
+  }
+  // Prevent a double border
+  caption + thead tr:first-child th,
+  caption + tbody tr:first-child th,
+  caption + tbody tr:first-child td,
+  colgroup + thead tr:first-child th,
+  colgroup + tbody tr:first-child th,
+  colgroup + tbody tr:first-child td,
+  thead:first-child tr:first-child th,
+  tbody:first-child tr:first-child th,
+  tbody:first-child tr:first-child td {
+    border-top: 0;
+  }
+  // For first th or td in the first row in the first thead or tbody
+  thead:first-child tr:first-child > th:first-child,
+  tbody:first-child tr:first-child > td:first-child {
+    .border-top-left-radius(@baseBorderRadius);
+  }
+  thead:first-child tr:first-child > th:last-child,
+  tbody:first-child tr:first-child > td:last-child {
+    .border-top-right-radius(@baseBorderRadius);
+  }
+  // For first th or td in the last row in the last thead or tbody
+  thead:last-child tr:last-child > th:first-child,
+  tbody:last-child tr:last-child > td:first-child,
+  tfoot:last-child tr:last-child > td:first-child {
+    .border-bottom-left-radius(@baseBorderRadius);
+  }
+  thead:last-child tr:last-child > th:last-child,
+  tbody:last-child tr:last-child > td:last-child,
+  tfoot:last-child tr:last-child > td:last-child {
+    .border-bottom-right-radius(@baseBorderRadius);
+  }
+
+  // Clear border-radius for first and last td in the last row in the last tbody for table with tfoot
+  tfoot + tbody:last-child tr:last-child td:first-child {
+    .border-bottom-left-radius(0);
+  }
+  tfoot + tbody:last-child tr:last-child td:last-child {
+    .border-bottom-right-radius(0);
+  }
+
+
+  // Special fixes to round the left border on the first td/th
+  caption + thead tr:first-child th:first-child,
+  caption + tbody tr:first-child td:first-child,
+  colgroup + thead tr:first-child th:first-child,
+  colgroup + tbody tr:first-child td:first-child {
+    .border-top-left-radius(@baseBorderRadius);
+  }
+  caption + thead tr:first-child th:last-child,
+  caption + tbody tr:first-child td:last-child,
+  colgroup + thead tr:first-child th:last-child,
+  colgroup + tbody tr:first-child td:last-child {
+    .border-top-right-radius(@baseBorderRadius);
+  }
+
+}
+
+
+
+
+// ZEBRA-STRIPING
+// --------------
+
+// Default zebra-stripe styles (alternating gray and transparent backgrounds)
+.table-striped {
+  tbody {
+    > tr:nth-child(odd) > td,
+    > tr:nth-child(odd) > th {
+      background-color: @tableBackgroundAccent;
+    }
+  }
+}
+
+
+// HOVER EFFECT
+// ------------
+// Placed here since it has to come after the potential zebra striping
+.table-hover {
+  tbody {
+    tr:hover td,
+    tr:hover th {
+      background-color: @tableBackgroundHover;
+    }
+  }
+}
+
+
+// TABLE CELL SIZING
+// -----------------
+
+// Reset default grid behavior
+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 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); }
+}
+
+
+
+// TABLE BACKGROUNDS
+// -----------------
+// Exact selectors below required to override .table-striped
+
+.table tbody tr {
+  &.success td {
+    background-color: @successBackground;
+  }
+  &.error td {
+    background-color: @errorBackground;
+  }
+  &.warning td {
+    background-color: @warningBackground;
+  }
+  &.info td {
+    background-color: @infoBackground;
+  }
+}
+
+// Hover states for .table-hover
+.table-hover tbody tr {
+  &.success:hover td {
+    background-color: darken(@successBackground, 5%);
+  }
+  &.error:hover td {
+    background-color: darken(@errorBackground, 5%);
+  }
+  &.warning:hover td {
+    background-color: darken(@warningBackground, 5%);
+  }
+  &.info:hover td {
+    background-color: darken(@infoBackground, 5%);
+  }
+}

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/tests/buttons.html
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/tests/buttons.html b/src/fauxton/jam/bootstrap/less/tests/buttons.html
new file mode 100644
index 0000000..9b3c2c5
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/tests/buttons.html
@@ -0,0 +1,139 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Buttons &middot; Bootstrap</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <!-- Le styles -->
+    <link href="../../docs/assets/css/bootstrap.css" rel="stylesheet">
+    <style>
+      body {
+        padding-top: 30px;
+        padding-bottom: 30px;
+      }
+    </style>
+    <link href="../../docs/assets/css/bootstrap-responsive.css" rel="stylesheet">
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
+    <!--[if lt IE 9]>
+      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    <!-- Le fav and touch icons -->
+    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../../docs/assets/ico/apple-touch-icon-144-precomposed.png">
+    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../../docs/assets/ico/apple-touch-icon-114-precomposed.png">
+      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../docs/assets/ico/apple-touch-icon-72-precomposed.png">
+                    <link rel="apple-touch-icon-precomposed" href="../../docs/assets/ico/apple-touch-icon-57-precomposed.png">
+                                   <link rel="shortcut icon" href="../../docs/assets/ico/favicon.png">
+  </head>
+
+  <body>
+
+    <div class="container">
+
+      <h2>Dropups</h2>
+      <div class="btn-toolbar">
+        <div class="btn-group dropup">
+          <button class="btn">Dropup</button>
+          <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+        <div class="btn-group dropup">
+          <button class="btn btn-primary">Dropup</button>
+          <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+        <div class="btn-group dropup">
+          <button class="btn btn-danger">Dropup</button>
+          <button class="btn btn-danger dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+        <div class="btn-group dropup">
+          <button class="btn btn-warning">Dropup</button>
+          <button class="btn btn-warning dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+        <div class="btn-group dropup">
+          <button class="btn btn-success">Dropup</button>
+          <button class="btn btn-success dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+        <div class="btn-group dropup">
+          <button class="btn btn-info">Dropup</button>
+          <button class="btn btn-info dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+        <div class="btn-group dropup">
+          <button class="btn btn-inverse">Dropup</button>
+          <button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+      </div><!-- /btn-toolbar -->
+
+
+    </div> <!-- /container -->
+
+    <!-- Le javascript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <script src="../../docs/assets/js/jquery.js"></script>
+    <script src="../../docs/assets/js/bootstrap-transition.js"></script>
+    <script src="../../docs/assets/js/bootstrap-alert.js"></script>
+    <script src="../../docs/assets/js/bootstrap-modal.js"></script>
+    <script src="../../docs/assets/js/bootstrap-dropdown.js"></script>
+    <script src="../../docs/assets/js/bootstrap-scrollspy.js"></script>
+    <script src="../../docs/assets/js/bootstrap-tab.js"></script>
+    <script src="../../docs/assets/js/bootstrap-tooltip.js"></script>
+    <script src="../../docs/assets/js/bootstrap-popover.js"></script>
+    <script src="../../docs/assets/js/bootstrap-button.js"></script>
+    <script src="../../docs/assets/js/bootstrap-collapse.js"></script>
+    <script src="../../docs/assets/js/bootstrap-carousel.js"></script>
+    <script src="../../docs/assets/js/bootstrap-typeahead.js"></script>
+
+  </body>
+</html>

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/tests/css-tests.css
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/tests/css-tests.css b/src/fauxton/jam/bootstrap/less/tests/css-tests.css
new file mode 100644
index 0000000..9edaf69
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/tests/css-tests.css
@@ -0,0 +1,139 @@
+/*!
+ * Bootstrap CSS Tests
+ */
+
+
+/* Remove background image */
+body {
+  background-image: none;
+}
+
+/* Space out subhead */
+.subhead {
+  margin-bottom: 36px;
+}
+/*h4 {
+  margin-bottom: 5px;
+}
+*/
+
+.type-test {
+  margin-bottom: 20px;
+  padding: 0 20px 20px;
+  background: url(../../docs/assets/img/grid-baseline-20px.png);
+}
+.type-test h1,
+.type-test h2,
+.type-test h3,
+.type-test h4,
+.type-test h5,
+.type-test h6 {
+  background-color: rgba(255,0,0,.2);
+}
+
+
+/* colgroup tests */
+.col1 {
+  background-color: rgba(255,0,0,.1);
+}
+.col2 {
+  background-color: rgba(0,255,0,.1);
+}
+.col3 {
+  background-color: rgba(0,0,255,.1);
+}
+
+
+/* Fluid row inputs */
+#rowInputs .row > [class*=span],
+#fluidRowInputs .row-fluid > [class*=span] {
+  background-color: rgba(255,0,0,.1);
+}
+
+
+/* Fluid grid */
+.fluid-grid {
+  margin-bottom: 45px;
+}
+.fluid-grid .row {
+  height: 40px;
+  padding-top: 10px;
+  margin-top: 10px;
+  color: #ddd;
+  text-align: center;
+}
+.fluid-grid .span1 {
+  background-color: #999;
+}
+
+
+/* Gradients */
+
+[class^="gradient-"] {
+  width: 100%;
+  height: 400px;
+  margin: 20px 0;
+  -webkit-border-radius: 5px;
+     -moz-border-radius: 5px;
+          border-radius: 5px;
+}
+
+.gradient-horizontal {
+  background-color: #333333;
+  background-image: -moz-linear-gradient(left, #555555, #333333);
+  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#555555), to(#333333));
+  background-image: -webkit-linear-gradient(left, #555555, #333333);
+  background-image: -o-linear-gradient(left, #555555, #333333);
+  background-image: linear-gradient(to right, #555555, #333333);
+  background-repeat: repeat-x;
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff555555', endColorstr='#ff333333', GradientType=1);
+}
+
+.gradient-vertical {
+  background-color: #474747;
+  background-image: -moz-linear-gradient(top, #555555, #333333);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#555555), to(#333333));
+  background-image: -webkit-linear-gradient(top, #555555, #333333);
+  background-image: -o-linear-gradient(top, #555555, #333333);
+  background-image: linear-gradient(to bottom, #555555, #333333);
+  background-repeat: repeat-x;
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff555555', endColorstr='#ff333333', GradientType=0);
+}
+
+.gradient-directional {
+  background-color: #333333;
+  background-image: -moz-linear-gradient(45deg, #555555, #333333);
+  background-image: -webkit-linear-gradient(45deg, #555555, #333333);
+  background-image: -o-linear-gradient(45deg, #555555, #333333);
+  background-image: linear-gradient(45deg, #555555, #333333);
+  background-repeat: repeat-x;
+}
+
+.gradient-vertical-three {
+  background-color: #8940a5;
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#00b3ee), color-stop(50%, #7a43b6), to(#c3325f));
+  background-image: -webkit-linear-gradient(#00b3ee, #7a43b6 50%, #c3325f);
+  background-image: -moz-linear-gradient(top, #00b3ee, #7a43b6 50%, #c3325f);
+  background-image: -o-linear-gradient(#00b3ee, #7a43b6 50%, #c3325f);
+  background-image: linear-gradient(#00b3ee, #7a43b6 50%, #c3325f);
+  background-repeat: no-repeat;
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff00b3ee', endColorstr='#ffc3325f', GradientType=0);
+}
+
+.gradient-radial {
+  background-color: #333333;
+  background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(#555555), to(#333333));
+  background-image: -webkit-radial-gradient(circle, #555555, #333333);
+  background-image: -moz-radial-gradient(circle, #555555, #333333);
+  background-image: -o-radial-gradient(circle, #555555, #333333);
+  background-repeat: no-repeat;
+}
+
+.gradient-striped {
+  background-color: #555555;
+  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/tests/css-tests.html
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/tests/css-tests.html b/src/fauxton/jam/bootstrap/less/tests/css-tests.html
new file mode 100644
index 0000000..035ba8b
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/tests/css-tests.html
@@ -0,0 +1,1345 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>CSS Tests · Twitter Bootstrap</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <!-- Le styles -->
+    <link href="../../docs/assets/css/bootstrap.css" rel="stylesheet">
+    <link href="../../docs/assets/css/bootstrap-responsive.css" rel="stylesheet">
+    <link href="../../docs/assets/css/docs.css" rel="stylesheet">
+    <link href="../../docs/assets/js/google-code-prettify/prettify.css" rel="stylesheet">
+
+    <!-- CSS just for the tests page -->
+    <link href="css-tests.css" rel="stylesheet">
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
+    <!--[if lt IE 9]>
+      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    <!-- Le fav and touch icons -->
+    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../../docs/assets/ico/apple-touch-icon-144-precomposed.png">
+    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../../docs/assets/ico/apple-touch-icon-114-precomposed.png">
+      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../docs/assets/ico/apple-touch-icon-72-precomposed.png">
+                    <link rel="apple-touch-icon-precomposed" href="../../docs/assets/ico/apple-touch-icon-57-precomposed.png">
+                                   <link rel="shortcut icon" href="../../docs/assets/ico/favicon.png">
+  </head>
+
+  <body>
+
+
+  <!-- Navbar
+    ================================================== -->
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="../../docs/index.html">Bootstrap</a>
+        </div>
+      </div>
+    </div>
+
+
+<!-- Masthead
+================================================== -->
+<header class="jumbotron subhead" id="overview">
+  <div class="container">
+    <h1>CSS Tests</h1>
+    <p class="lead">One stop shop for quick debugging and edge-case tests of CSS.</p>
+  </div>
+</header>
+
+
+<div class="bs-docs-canvas">
+
+  <div class="container">
+
+
+
+<!-- Typography
+================================================== -->
+
+<div class="page-header">
+  <h1>Typography</h1>
+</div>
+
+<div class="row">
+  <div class="span6">
+    <div class="type-test">
+      <h1>h1. Heading 1</h1>
+      <h2>h2. Heading 2</h2>
+      <h3>h3. Heading 3</h3>
+      <h4>h4. Heading 4</h4>
+      <h5>h5. Heading 5</h5>
+      <h6>h6. Heading 6</h6>
+      <p>Sed posuere consectetur est at lobortis. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
+    </div>
+  </div>
+  <div class="span6">
+    <div class="type-test">
+      <h1>h1. Heading 1</h1>
+      <p>Sed posuere consectetur est at lobortis. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
+      <h2>h2. Heading 2</h2>
+      <p>Sed posuere consectetur est at lobortis. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
+      <h3>h3. Heading 3</h3>
+      <p>Sed posuere consectetur est at lobortis. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
+      <h4>h4. Heading 4</h4>
+      <p>Sed posuere consectetur est at lobortis. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
+      <h5>h5. Heading 5</h5>
+      <p>Sed posuere consectetur est at lobortis. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
+      <h6>h6. Heading 6</h6>
+      <p>Sed posuere consectetur est at lobortis. Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
+    </div>
+  </div>
+</div>
+
+
+
+<!-- Responsive images
+================================================== -->
+
+<div class="page-header">
+  <h1>Responsive images</h1>
+</div>
+
+<div class="row">
+  <div class="span4">
+    <img data-src="holder.js/600x600" height="200">
+  </div>
+  <div class="span4">
+    <img data-src="holder.js/600x600">
+  </div>
+  <div class="span4">
+    <img data-src="holder.js/600x600">
+  </div>
+</div>
+
+<br>
+
+<div class="row">
+  <div class="span4">
+    <img data-src="holder.js/600x900" style="width: 200px;">
+  </div>
+  <div class="span4">
+    <img data-src="holder.js/200x300">
+  </div>
+  <div class="span4">
+    <img data-src="holder.js/600x600">
+  </div>
+</div>
+
+<br><br>
+
+
+
+
+<!-- Fluid grid
+================================================== -->
+
+<div class="page-header">
+  <h1>Fluid grids</h1>
+</div>
+
+<div class="fluid-grid">
+  <div class="row">
+    <div class="span12">12
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span11">11
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+    <div class="span1">1
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span10">10
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+    <div class="span2">2
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span9">9
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+    <div class="span3">3
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span8">8
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+    <div class="span4">4
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span7">7
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+    <div class="span5">5
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span6">6
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+    <div class="span6">6
+      <div class="row-fluid">
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+        <div class="span1">1</div>
+      </div>
+    </div>
+  </div>
+</div> <!-- fluid grids -->
+
+
+
+<!-- Tables
+================================================== -->
+
+<div class="page-header">
+  <h1>Tables</h1>
+</div>
+
+<div class="row">
+  <div class="span6">
+    <h4>Bordered without thead</h4>
+    <table class="table table-bordered">
+      <tbody>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+      </tbody>
+    </table>
+    <h4>Bordered without thead, with caption</h4>
+    <table class="table table-bordered">
+      <caption>Table caption</caption>
+      <tbody>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+      </tbody>
+    </table>
+    <h4>Bordered without thead, with colgroup</h4>
+    <table class="table table-bordered">
+      <colgroup>
+        <col class="col1">
+        <col class="col2">
+        <col class="col3">
+      </colgroup>
+      <tbody>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+      </tbody>
+      <tfoot>
+        <tr>
+          <td>3</td>
+          <td>6</td>
+          <td>9</td>
+        </tr>
+      </tfoot>
+    </table>
+    <h4>Bordered with thead, with colgroup</h4>
+    <table class="table table-bordered">
+      <colgroup>
+        <col class="col1">
+        <col class="col2">
+        <col class="col3">
+      </colgroup>
+      <thead>
+        <tr>
+          <th>A</th>
+          <th>B</th>
+          <th>C</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+      </tbody>
+      <tfoot>
+        <tr>
+          <td>3</td>
+          <td>6</td>
+          <td>9</td>
+        </tr>
+      </tfoot>
+    </table>
+  </div><!--/span-->
+  <div class="span6">
+    <h4>Bordered with thead and caption</h4>
+    <table class="table table-bordered">
+      <caption>Table caption</caption>
+      <thead>
+        <tr>
+          <th>1</th>
+          <th>2</th>
+          <th>3</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td>2</td>
+          <td>3</td>
+        </tr>
+      </tbody>
+      <tfoot>
+        <tr>
+          <td>3</td>
+          <td>6</td>
+          <td>9</td>
+        </tr>
+      </tfoot>
+    </table>
+    <h4>Bordered with rowspan and colspan</h4>
+    <table class="table table-bordered">
+      <thead>
+        <tr>
+          <th>1</th>
+          <th>2</th>
+          <th>3</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td colspan="2">1 and 2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td rowspan="2">2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td rowspan="2">1</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td colspan="2">2 and 3</td>
+        </tr>
+      </tbody>
+    </table>
+  </div><!--/span-->
+</div><!--/row-->
+
+
+<h4>Grid sizing</h4>
+<div class="row">
+  <div class="span12">
+    <table class="table table-bordered">
+      <thead>
+        <tr>
+          <th class="span3">1</th>
+          <th class="span4">2</th>
+          <th>3</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td colspan="2">1 and 2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td rowspan="2">2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td rowspan="2">1</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td colspan="2">2 and 3</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div><!--/row-->
+
+<h4>Nesting and striping</h4>
+<table class="table table-bordered table-striped">
+  <thead>
+    <tr>
+      <th>Test</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>
+        <table class="table table-bordered table-striped">
+          <thead>
+            <tr>
+              <th>Test</th>
+              <th>Test</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>
+                test
+              </td>
+              <td>
+                test
+              </td>
+            </tr>
+            <tr>
+              <td>
+                test
+              </td>
+              <td>
+                test
+              </td>
+            </tr>
+            <tr>
+              <td>
+                test
+              </td>
+              <td>
+                test
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </td>
+    </tr>
+  </tbody>
+</table>
+
+<h4>Fluid grid sizing</h4>
+<div class="row-fluid">
+  <div class="span12">
+    <table class="table table-bordered">
+      <thead>
+        <tr>
+          <th class="span3">1</th>
+          <th class="span4">2</th>
+          <th>3</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td colspan="2">1 and 2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td>1</td>
+          <td rowspan="2">2</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td rowspan="2">1</td>
+          <td>3</td>
+        </tr>
+        <tr>
+          <td colspan="2">2 and 3</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div><!--/row-->
+
+
+
+<!-- Forms
+================================================== -->
+
+<div class="page-header">
+  <h1>Forms</h1>
+</div>
+
+<h4>Buttons and button groups</h4>
+<form class="form-inline">
+  <button class="btn btn-success">Save</button>
+  <button class="btn btn-info">Add new</button>
+  <div class="btn-group">
+    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
+      <i class="icon-user"></i> User
+      <span class="caret"></span>
+    </a>
+    <ul class="dropdown-menu">
+      <li><a href="#">Profile</a></li>
+      <li class="divider"></li>
+      <li><a href="#">Sign Out</a></li>
+    </ul>
+  </div>
+</form>
+
+<h4>Horizontal form errors</h4>
+<form class="form-horizontal">
+  <div class="control-group error">
+    <label class="control-label" for="inputError">Radio with error</label>
+    <div class="controls">
+      <label class="radio">
+        <input type="radio" id="inputError"> Oh hai
+      </label>
+      <span class="help-inline">Please correct the error</span>
+    </div>
+  </div>
+</form>
+
+<div class="row">
+  <div class="span4">
+    <h4>Prepend and append on inputs</h4>
+    <form>
+      <div class="controls">
+        <div class="input-prepend">
+          <span class="add-on">@</span>
+          <input class="span2" id="prependedInput" size="16" type="text">
+        </div>
+      </div>
+      <div class="controls">
+        <div class="input-append">
+          <input class="span2" id="prependedInput" size="16" type="text">
+          <span class="add-on">@</span>
+        </div>
+      </div>
+      <div class="controls">
+        <div class="input-prepend input-append">
+          <span class="add-on">$</span>
+          <input class="span2" id="prependedInput" size="16" type="text">
+          <span class="add-on">.00</span>
+        </div>
+      </div>
+    </form>
+  </div><!--/span-->
+  <div class="span4">
+    <h4>Prepend and append with uneditable</h4>
+    <form>
+      <div class="input-prepend">
+        <span class="add-on">$</span>
+        <span class="span2 uneditable-input">Some value here</span>
+      </div>
+      <div class="input-append">
+        <span class="span2 uneditable-input">Some value here</span>
+        <span class="add-on">.00</span>
+      </div>
+      <div class="input-prepend input-append">
+        <span class="add-on">$</span>
+        <span class="span2 uneditable-input">Some value here</span>
+        <span class="add-on">.00</span>
+      </div>
+    </form>
+  </div><!--/span-->
+  <div class="span4">
+    <h4>Prepend with type="submit"</h4>
+    <form class="form-search">
+      <div class="input-append">
+        <input type="text" class="span2 search-query" value="" name="q">
+        <input type="submit" value="Search" class="btn">
+      </div>
+    </form>
+    <div class="input-append">
+      <input type="text" class="span2" value="" name="">
+      <input type="submit" value="Button" class="btn">
+    </div>
+    <div class="input-append">
+      <input type="text" size="16" id="appendedInputButtons" class="span2">
+      <input type="submit" value="Search" class="btn">
+      <button type="button" class="btn">Options</button>
+    </div>
+  </div><!--/span-->
+</div><!--/row-->
+
+<h4>Fluid prepended and appended inputs</h4>
+<div class="row-fluid">
+  <div class="span6">
+    <form>
+      <div class="controls">
+        <div class="input-prepend">
+          <span class="add-on">@</span><input class="span2" id="prependedInput" size="16" type="text">
+        </div>
+      </div>
+      <div class="controls">
+        <div class="input-append">
+          <input class="span2" id="prependedInput" size="16" type="text"><span class="add-on">@</span>
+        </div>
+      </div>
+      <div class="controls">
+        <div class="input-prepend input-append">
+          <span class="add-on">$</span><input class="span2" id="prependedInput" size="16" type="text"><span class="add-on">.00</span>
+        </div>
+      </div>
+    </form>
+  </div>
+</div>
+
+<h4>Fixed row with inputs</h4>
+<p>Inputs should not extend past the light red background, set on their parent, a <code>.span*</code> column.</p>
+
+<div class="rowInputs">
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span1" placeholder="span1">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span2" placeholder="span2">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span3" placeholder="span3">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span4" placeholder="span4">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span5" placeholder="span5">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span6" placeholder="span6">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span7" placeholder="span7">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span8" placeholder="span8">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span9" placeholder="span9">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span10" placeholder="span10">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span11" placeholder="span11">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row">
+    <div class="span12">
+      <input type="text" class="span12" placeholder="span12">
+    </div><!--/span-->
+  </div><!--/row-->
+</div>
+<br>
+
+<h4>Fluid row with inputs</h4>
+<p>Inputs should not extend past the light red background, set on their parent, a <code>.span*</code> column.</p>
+<div id="fluidRowInputs">
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span1" placeholder="span1">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span2" placeholder="span2">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span3" placeholder="span3">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span4" placeholder="span4">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span5" placeholder="span5">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span6" placeholder="span6">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span7" placeholder="span7">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span8" placeholder="span8">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span9" placeholder="span9">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span10" placeholder="span10">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span11" placeholder="span11">
+    </div><!--/span-->
+  </div><!--/row-->
+  <div class="row-fluid">
+    <div class="span12">
+      <input type="text" class="span12" placeholder="span12">
+    </div><!--/span-->
+  </div><!--/row-->
+</div>
+
+<br>
+
+<h4>Inline form in fluid row</h4>
+
+<div class="row-fluid">
+  <div class="span12">
+    <form class="form-inline">
+      <input type="text" class="span3" placeholder="Email">
+      <input type="password" class="span3" placeholder="Password">
+      <label class="checkbox">
+        <input type="checkbox"> Remember me
+      </label>
+      <button type="submit" class="btn">Sign in</button>
+    </form>
+  </div>
+</div>
+
+
+<br>
+
+
+<h4>Fluid textarea at .span12</h4>
+<div class="row-fluid">
+  <div class="span12">
+    <textarea class="span12"></textarea>
+  </div>
+</div>
+
+
+<br>
+
+
+<h4>Selects</h4>
+<form>
+  <select class="span4">
+    <option>Option</option>
+  </select>
+</form>
+
+
+<br>
+
+
+
+
+<!-- Dropdowns
+================================================== -->
+
+<div class="page-header">
+  <h1>Dropdowns</h1>
+</div>
+
+<h4>Dropdown link with hash URL</h4>
+<ul class="nav nav-pills">
+  <li class="active"><a href="#">Link</a></li>
+  <li><a href="#">Example link</a></li>
+  <li class="dropdown">
+    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
+      Dropdown <span class="caret"></span>
+    </a>
+    <ul class="dropdown-menu">
+      <li><a href="#">Action</a></li>
+      <li><a href="#">Another action</a></li>
+      <li><a href="#">Something else here</a></li>
+      <li class="divider"></li>
+      <li><a href="#">Separated link</a></li>
+    </ul>
+  </li>
+</ul>
+
+<h4>Dropdown link with custom URL and data-target</h4>
+<ul class="nav nav-pills">
+  <li class="active"><a href="#">Link</a></li>
+  <li><a href="#">Example link</a></li>
+  <li class="dropdown">
+    <a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="path/to/page.html">
+      Dropdown <span class="caret"></span>
+    </a>
+    <ul class="dropdown-menu">
+      <li><a href="#">Action</a></li>
+      <li><a href="#">Another action</a></li>
+      <li><a href="#">Something else here</a></li>
+      <li class="divider"></li>
+      <li><a href="#">Separated link</a></li>
+    </ul>
+  </li>
+</ul>
+
+<h4>Dropdown on a button</h4>
+<div style="position: relative;">
+  <button class="btn" type="button" data-toggle="dropdown">Dropdown <span class="caret"></span></button>
+  <ul class="dropdown-menu">
+    <li><a href="#">Action</a></li>
+    <li><a href="#">Another action</a></li>
+    <li><a href="#">Something else here</a></li>
+    <li class="divider"></li>
+    <li><a href="#">Separated link</a></li>
+  </ul>
+</div>
+
+<br>
+
+
+<!-- Thumbnails
+================================================== -->
+
+<div class="page-header">
+  <h1>Thumbnails</h1>
+</div>
+
+<h4>Default thumbnails (no grid sizing)</h4>
+<ul class="thumbnails">
+  <li class="thumbnail">
+    <img data-src="holder.js/260x180" alt="">
+  </li>
+  <li class="thumbnail">
+    <img data-src="holder.js/260x180" alt="">
+  </li>
+  <li class="thumbnail">
+    <img data-src="holder.js/260x180" alt="">
+  </li>
+  <li class="thumbnail">
+    <img data-src="holder.js/260x180" alt="">
+  </li>
+</ul>
+
+<!-- NOT CURRENTLY SUPPORTED
+<h4>Offset thumbnails</h4>
+<ul class="thumbnails">
+  <li class="span3 offset3">
+    <a href="#" class="thumbnail">
+      <img data-src="holder.js/260x180" alt="">
+    </a>
+  </li>
+  <li class="span3">
+    <a href="#" class="thumbnail">
+      <img data-src="holder.js/260x180" alt="">
+    </a>
+  </li>
+  <li class="span3">
+    <a href="#" class="thumbnail">
+      <img data-src="holder.js/260x180" alt="">
+    </a>
+  </li>
+</ul>
+-->
+
+<h4>Standard grid sizing</h4>
+<ul class="thumbnails">
+  <li class="span3">
+    <a href="#" class="thumbnail">
+      <img data-src="holder.js/260x180" alt="">
+    </a>
+  </li>
+  <li class="span3 offset3">
+    <a href="#" class="thumbnail">
+      <img data-src="holder.js/260x180" alt="">
+    </a>
+  </li>
+  <li class="span3">
+    <a href="#" class="thumbnail">
+      <img data-src="holder.js/260x180" alt="">
+    </a>
+  </li>
+</ul>
+
+<h4>Fluid thumbnails</h4>
+<div class="row-fluid">
+  <div class="span8">
+    <ul class="thumbnails">
+      <li class="span4">
+        <a href="#" class="thumbnail">
+          <img data-src="holder.js/260x180" alt="">
+        </a>
+      </li>
+      <li class="span4">
+        <a href="#" class="thumbnail">
+          <img data-src="holder.js/260x180" alt="">
+        </a>
+      </li>
+      <li class="span4">
+        <a href="#" class="thumbnail">
+          <img data-src="holder.js/260x180" alt="">
+        </a>
+      </li>
+    </ul>
+  </div>
+</div>
+
+
+
+<!-- Tabs
+================================================== -->
+
+<div class="page-header">
+  <h1>Tabs</h1>
+</div>
+
+<div class="tabbable tabs-left" style="margin-bottom: 18px;">
+  <ul class="nav nav-tabs">
+    <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li>
+    <li><a href="#tab2" data-toggle="tab">Section 2</a></li>
+    <li><a href="#tab3" data-toggle="tab">Section 3</a></li>
+  </ul>
+  <div class="tab-content" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
+    <div class="tab-pane active" id="tab1">
+      <p>I'm in Section 1.</p>
+
+      <div class="tabbable" style="background: #f5f5f5; padding: 20px;">
+        <ul class="nav nav-tabs">
+          <li class="active"><a href="#tab1-1" data-toggle="tab">1.1</a></li>
+          <li><a href="#tab1-2" data-toggle="tab">1.2</a></li>
+          <li><a href="#tab1-3" data-toggle="tab">1.3</a></li>
+        </ul>
+        <div class="tab-content" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
+          <div class="tab-pane active" id="tab1-1">
+            <p>I'm in Section 1.1.</p>
+          </div>
+          <div class="tab-pane" id="tab1-2">
+            <p>I'm in Section 1.2.</p>
+          </div>
+          <div class="tab-pane" id="tab1-3">
+            <p>I'm in Section 1.3.</p>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="tab-pane" id="tab2">
+      <p>Howdy, I'm in Section 2.</p>
+    </div>
+    <div class="tab-pane" id="tab3">
+      <p>What up girl, this is Section 3.</p>
+    </div>
+  </div>
+</div> <!-- /tabbable -->
+
+<br>
+
+
+<!-- Labels
+================================================== -->
+
+<div class="page-header">
+  <h1>Labels</h1>
+</div>
+
+<div class="row">
+  <div class="span4">
+    <h4>Inline label</h4>
+    <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Maecenas sed diam <span class="label label-warning">Label name</span> eget risus varius blandit sit amet non magna. Fusce <code>.class-name</code> dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
+  </div><!--/span-->
+  <div class="span4">
+    <form class="form-horizontal">
+      <label>Example label</label>
+      <input type="text" placeholder="Input"> <span class="help-inline"><span class="label">Hey!</span> Read this.</span>
+    </form>
+  </div><!--/span-->
+  <div class="span4">
+    <button class="btn">Action <span class="badge">2</span></button>
+    <button class="btn">Action <span class="label">2</span></button>
+  </div><!--/span-->
+</div><!--/row-->
+
+<br>
+
+
+<!-- Button groups
+================================================== -->
+
+<div class="page-header">
+  <h1>Buttons</h1>
+</div>
+
+<table class="table table-bordered">
+  <tbody>
+    <tr>
+      <td>
+        Maecenas faucibus mollis interdum. Nulla vitae elit libero, a pharetra augue. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
+      </td>
+      <td>
+        <div class="btn-group">
+          <button class="btn">1</button>
+          <button class="btn">2</button>
+          <button class="btn">3</button>
+          <button class="btn">4</button>
+        </div>
+      </td>
+    </tr>
+  </tbody>
+</table>
+
+<h4>Mini buttons: text and icon</h4>
+<div class="btn-group">
+  <button class="btn btn-mini">Button text</button>
+  <button class="btn btn-mini"><i class="icon-cog"></i></button>
+</div>
+
+<br>
+
+
+
+<!-- Responsive utility classes
+================================================== -->
+
+<div class="page-header">
+  <h1>Responsive utility classes</h1>
+</div>
+
+<h4>Visible on...</h4>
+<ul class="responsive-utilities-test visible-on">
+  <li>Phone<span class="visible-phone">✔ Phone</span></li>
+  <li>Tablet<span class="visible-tablet">✔ Tablet</span></li>
+  <li>Desktop<span class="visible-desktop">✔ Desktop</span></li>
+</ul>
+<ul class="responsive-utilities-test visible-on">
+  <li>Phone + Tablet<span class="visible-phone visible-tablet">✔ Phone + Tablet</span></li>
+  <li>Tablet + Desktop<span class="visible-tablet visible-desktop">✔ Tablet + Desktop</span></li>
+  <li>All<span class="visible-phone visible-tablet visible-desktop">✔ All</span></li>
+</ul>
+
+<h4>Hidden on...</h4>
+<ul class="responsive-utilities-test hidden-on">
+  <li>Phone<span class="hidden-phone">✔ Phone</span></li>
+  <li>Tablet<span class="hidden-tablet">✔ Tablet</span></li>
+  <li>Desktop<span class="hidden-desktop">✔ Desktop</span></li>
+</ul>
+<ul class="responsive-utilities-test hidden-on">
+  <li>Phone + Tablet<span class="hidden-phone hidden-tablet">✔ Phone + Tablet</span></li>
+  <li>Tablet + Desktop<span class="hidden-tablet hidden-desktop">✔ Tablet + Desktop</span></li>
+  <li>All<span class="hidden-phone hidden-tablet hidden-desktop">✔ All</span></li>
+</ul>
+
+
+
+<!-- Gradients
+================================================== -->
+
+<div class="page-header">
+  <h1>Gradients</h1>
+</div>
+
+<h4>Horizontal</h4>
+<div class="gradient-horizontal"></div>
+
+<h4>Vertical</h4>
+<div class="gradient-vertical"></div>
+
+<h4>Directional</h4>
+<div class="gradient-directional"></div>
+
+<h4>Three colors</h4>
+<div class="gradient-vertical-three"></div>
+
+<h4>Radial</h4>
+<div class="gradient-radial"></div>
+
+<h4>Striped</h4>
+<div class="gradient-striped"></div>
+
+
+
+
+
+
+
+    </div><!-- /container -->
+
+
+
+    <!-- Footer
+    ================================================== -->
+    <footer class="footer">
+      <div class="container">
+        <p class="pull-right"><a href="#">Back to top</a></p>
+        <p>Designed and built with all the love in the world <a href="http://twitter.com/twitter" target="_blank">@twitter</a> by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>.</p>
+        <p>Code licensed under the <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>. Documentation licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
+        <p>Icons from <a href="http://glyphicons.com">Glyphicons Free</a>, licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
+        <ul class="footer-links">
+          <li><a href="http://blog.getbootstrap.com">Read the blog</a></li>
+          <li><a href="https://github.com/twitter/bootstrap/issues?state=open">Submit issues</a></li>
+          <li><a href="https://github.com/twitter/bootstrap/wiki">Roadmap and changelog</a></li>
+        </ul>
+      </div>
+    </footer>
+
+</div>
+
+
+    <!-- Le javascript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
+    <script src="../../docs/assets/js/jquery.js"></script>
+    <script src="../../docs/assets/js/google-code-prettify/prettify.js"></script>
+    <script src="../../docs/assets/js/bootstrap-transition.js"></script>
+    <script src="../../docs/assets/js/bootstrap-alert.js"></script>
+    <script src="../../docs/assets/js/bootstrap-modal.js"></script>
+    <script src="../../docs/assets/js/bootstrap-dropdown.js"></script>
+    <script src="../../docs/assets/js/bootstrap-scrollspy.js"></script>
+    <script src="../../docs/assets/js/bootstrap-tab.js"></script>
+    <script src="../../docs/assets/js/bootstrap-tooltip.js"></script>
+    <script src="../../docs/assets/js/bootstrap-popover.js"></script>
+    <script src="../../docs/assets/js/bootstrap-button.js"></script>
+    <script src="../../docs/assets/js/bootstrap-collapse.js"></script>
+    <script src="../../docs/assets/js/bootstrap-carousel.js"></script>
+    <script src="../../docs/assets/js/bootstrap-typeahead.js"></script>
+    <script src="../../docs/assets/js/application.js"></script>
+
+
+  </body>
+</html>

http://git-wip-us.apache.org/repos/asf/couchdb/blob/4615a788/src/fauxton/jam/bootstrap/less/tests/forms-responsive.html
----------------------------------------------------------------------
diff --git a/src/fauxton/jam/bootstrap/less/tests/forms-responsive.html b/src/fauxton/jam/bootstrap/less/tests/forms-responsive.html
new file mode 100644
index 0000000..c3e208d
--- /dev/null
+++ b/src/fauxton/jam/bootstrap/less/tests/forms-responsive.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Bootstrap, from Twitter</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <!-- Le styles -->
+    <link href="../../docs/assets/css/bootstrap.css" rel="stylesheet">
+    <link href="../../docs/assets/css/bootstrap-responsive.css" rel="stylesheet">
+    <style>
+      body {
+        padding-top: 30px;
+        padding-bottom: 30px;
+      }
+    </style>
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
+    <!--[if lt IE 9]>
+      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+
+    <!-- Le fav and touch icons -->
+    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../../docs/assets/ico/apple-touch-icon-144-precomposed.png">
+    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../../docs/assets/ico/apple-touch-icon-114-precomposed.png">
+      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../docs/assets/ico/apple-touch-icon-72-precomposed.png">
+                    <link rel="apple-touch-icon-precomposed" href="../../docs/assets/ico/apple-touch-icon-57-precomposed.png">
+                                   <link rel="shortcut icon" href="../../docs/assets/ico/favicon.png">
+  </head>
+
+  <body>
+
+    <form class="container">
+
+      <div class="page-header">
+        <h1>Fixed grid</h1>
+      </div>
+
+      <h3>Vertical alignment</h3>
+      <input type="text" class="span2" placeholder="span2">
+      <select class="span2"><option>span2</option></select>
+      <span class="uneditable-input span2">span1</span>
+
+      <h3>Width across elements</h3>
+      <div>
+        <input type="text" class="span2" placeholder="span2">
+      </div>
+      <div>
+        <select class="span2"><option>span2</option></select>
+      </div>
+      <div>
+        <span class="uneditable-input span2">span2</span>
+      </div>
+
+
+      <div class="page-header">
+        <h1>Fluid grid</h1>
+      </div>
+
+      <div class="row-fluid">
+        <input type="text" class="span2" placeholder="span2">
+        <select class="span2"><option>span2</option></select>
+        <span class="uneditable-input span2">span1</span>
+      </div>
+
+    </form> <!-- /container -->
+
+  </body>
+</html>


Mime
View raw message