compass_twitter_bootstrap 2.0.3 → 2.2.2

data/stylesheets/compass_twitter_bootstrap/_responsive-768px-979px.scss

@@ -1,17 +1,19 @@
-// PORTRAIT TABLET TO DEFAULT DESKTOP
-// ----------------------------------
+//
+// Responsive: Tablet to desktop
+// --------------------------------------------------
+
 
 @media (min-width: 768px) and (max-width: 979px) {
 
   // Fixed grid
-  @include bootstrap-grid-core(42px, 20px);
+  @include ctb-grid-core($gridColumnWidth768, $gridGutterWidth768);
 
   // Fluid grid
-  @include bootstrap-grid-fluid(5.801104972%, 2.762430939%);
+  @include ctb-grid-fluid($fluidGridColumnWidth768, $fluidGridGutterWidth768);
 
   // Input grid
-  @include bootstrap-grid-input(42px, 20px);
+  @include ctb-grid-input($gridColumnWidth768, $gridGutterWidth768);
 
-  // No need to reset .thumbnails here since it's the same @gridGutterWidth
+  // No need to reset .thumbnails here since it's the same $gridGutterWidth
 
 }

data/stylesheets/compass_twitter_bootstrap/_responsive-navbar.scss

@@ -1,6 +1,11 @@
+//
+// Responsive: Navbar
+// --------------------------------------------------
+
+
 // TABLETS AND BELOW
 // -----------------
-@media (max-width: 979px) {
+@media (max-width: $navbarCollapseWidth) {
 
   // UNFIX THE TOPBAR
   // ----------------
@@ -8,12 +13,19 @@
   body {
     padding-top: 0;
   }
-  // Unfix the navbar
-  .navbar-fixed-top {
+  // Unfix the navbars
+  .navbar-fixed-top,
+  .navbar-fixed-bottom {
     position: static;
+  }
+  .navbar-fixed-top {
     margin-bottom: $baseLineHeight;
   }
-  .navbar-fixed-top .navbar-inner {
+  .navbar-fixed-bottom {
+    margin-top: $baseLineHeight;
+  }
+  .navbar-fixed-top .navbar-inner,
+  .navbar-fixed-bottom .navbar-inner {
     padding: 5px;
   }
   .navbar .container {
@@ -54,16 +66,16 @@
   // Nav and dropdown links in navbar
   .nav-collapse .nav > li > a,
   .nav-collapse .dropdown-menu a {
-    padding: 6px 15px;
+    padding: 9px 15px;
     font-weight: bold;
     color: $navbarLinkColor;
-    @include bootstrap-border-radius(3px);
+    @include ctb-border-radius(3px);
   }
   // Buttons
   .nav-collapse .btn {
     padding: 4px 10px 4px;
     font-weight: normal;
-    @include bootstrap-border-radius(4px);
+    @include ctb-border-radius($baseBorderRadius);
   }
   .nav-collapse .dropdown-menu li + li a {
     margin-bottom: 2px;
@@ -72,6 +84,14 @@
   .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;
@@ -83,15 +103,19 @@
     top: auto;
     left: auto;
     float: none;
-    display: block;
+    display: none;
     max-width: none;
     margin: 0 15px;
     padding: 0;
     background-color: transparent;
     border: none;
-    @include bootstrap-border-radius(0);
-    @include bootstrap-box-shadow(none);
+    @include ctb-border-radius(0);
+    @include ctb-box-shadow(none);
   }
+  .nav-collapse .open > .dropdown-menu {
+    display: block;
+  }
+
   .nav-collapse .dropdown-menu:before,
   .nav-collapse .dropdown-menu:after {
     display: none;
@@ -99,6 +123,12 @@
   .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 {
@@ -107,7 +137,12 @@
     margin: ($baseLineHeight / 2) 0;
     border-top: 1px solid $navbarBackground;
     border-bottom: 1px solid $navbarBackground;
-    @include bootstrap-box-shadow("inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1)");
+    @include ctb-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 {
@@ -131,16 +166,20 @@
     padding-left:  10px;
     padding-right: 10px;
   }
+
+
 }
 
 
 // DEFAULT DESKTOP
 // ---------------
 
-// Required to make the collapsing navbar work on regular desktops
-@media (min-width: 980px) {
+@media (min-width: $navbarCollapseDesktopWidth) {
+
+  // Required to make the collapsing navbar work on regular desktops
   .nav-collapse.collapse {
     height: auto !important;
     overflow: visible !important;
   }
-}
+
+}

data/stylesheets/compass_twitter_bootstrap/_responsive-utilities.scss

@@ -1,5 +1,7 @@
-// RESPONSIVE CLASSES
-// ------------------
+//
+// Responsive: Utility classes
+// --------------------------------------------------
+
 
 // Hide from screenreaders and browsers
 // Credit: HTML5 Boilerplate
@@ -13,29 +15,29 @@
 // For desktops
 .visible-phone     { display: none !important; }
 .visible-tablet    { display: none !important; }
-.visible-desktop   { } // Don't set initially
 .hidden-phone      { }
 .hidden-tablet     { }
 .hidden-desktop    { display: none !important; }
-
-// Phones only
-@media (max-width: 767px) {
-  // Show
-  .visible-phone     { display: inherit !important; } // Use inherit to restore previous behavior
-  // Hide
-  .hidden-phone      { display: none !important; }
-  // Hide everything else
-  .hidden-desktop    { display: inherit !important; }
-  .visible-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 ; }
+  .visible-desktop   { display: none !important; }
+  // Show
+  .visible-phone     { display: inherit !important; } // Use inherit to restore previous behavior
+  // Hide
+  .hidden-phone      { display: none !important; }
 }

data/stylesheets/compass_twitter_bootstrap/_responsive.scss

@@ -0,0 +1,48 @@
+/*!
+ * Bootstrap Responsive v2.1.0
+ *
+ * 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.scss
+// For phone and tablet devices
+// -------------------------------------------------------------
+
+
+// REPEAT VARIABLES & MIXINS
+// -------------------------
+// Required since we compile the responsive stuff separately
+
+@import "variables"; // Modify this for custom colors, font-sizes, etc
+@import "mixins";
+
+
+// RESPONSIVE CLASSES
+// ------------------
+
+@import "responsive-utilities";
+
+
+// MEDIA QUERIES
+// ------------------
+
+// Large desktops
+@import "responsive-1200px-min";
+
+// Tablets to regular desktops
+@import "responsive-768px-979px";
+
+// Phones to portrait tablets and narrow desktops
+@import "responsive-767px-max";
+
+
+// RESPONSIVE NAVBAR
+// ------------------
+
+// From 979px and below, show a button to toggle navbar contents
+@import "responsive-navbar";

data/stylesheets/compass_twitter_bootstrap/_scaffolding.scss

@@ -1,10 +1,10 @@
+//
 // Scaffolding
-// Basic and global styles for generating a grid system, structural layout, and page templates
-// -------------------------------------------------------------------------------------------
+// --------------------------------------------------
 
 
 // Body reset
-// ----------
+// -------------------------
 
 body {
   margin: 0;
@@ -17,7 +17,7 @@ body {
 
 
 // Links
-// -----
+// -------------------------
 
 a {
   color: $linkColor;
@@ -27,3 +27,26 @@ a:hover {
   color: $linkColorHover;
   text-decoration: underline;
 }
+
+
+// Images
+// -------------------------
+
+// Rounded corners
+.img-rounded {
+  @include ctb-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);
+  @include ctb-box-shadow(0 1px 3px rgba(0,0,0,.1));
+}
+
+// Perfect circle
+.img-circle {
+  @include ctb-border-radius(500px); // crank the border-radius so it works with most reasonably sized images
+}

data/stylesheets/compass_twitter_bootstrap/_sprites.scss

@@ -1,6 +1,6 @@
-// SPRITES
-// Glyphs and icons for buttons, nav, and more
-// -------------------------------------------
+//
+// Sprites
+// --------------------------------------------------
 
 
 // ICONS
@@ -19,16 +19,30 @@
   display: inline-block;
   width: 14px;
   height: 14px;
-  @include bootstrap-ie7-restore-right-whitespace();
+  @include ctb-ie7-restore-right-whitespace();
   line-height: 14px;
   vertical-align: text-top;
-  background-image: url("#{$iconSpritePath}");
+  background-image: image-url("#{$iconSpritePath}");
   background-position: 14px 14px;
   background-repeat: no-repeat;
-
+  margin-top: 1px;
 }
-.icon-white {
-  background-image: url("#{$iconWhiteSpritePath}");
+
+/* 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: image-url("#{$iconWhiteSpritePath}");
 }
 
 .icon-glass              { background-position: 0      0; }
@@ -145,7 +159,7 @@
 .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; }
+.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; }
@@ -153,7 +167,7 @@
 .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; }
+.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
 
@@ -177,15 +191,3 @@
 .icon-filter                  { background-position: -408px -144px; }
 .icon-briefcase               { background-position: -432px -144px; }
 .icon-fullscreen              { background-position: -456px -144px; }
-
-
-
-
-
-
-
-
-
-
-
-

data/stylesheets/compass_twitter_bootstrap/_tables.scss

@@ -1,7 +1,6 @@
 //
-// Tables.less
-// Tables for, you guessed it, tabular data
-// ----------------------------------------
+// Tables
+// --------------------------------------------------
 
 
 // BASE TABLES
@@ -49,6 +48,11 @@ table {
   tbody + tbody {
     border-top: 2px solid $tableBorder;
   }
+
+  // Nesting
+  .table {
+    background-color: $bodyBackground;
+  }
 }
 
 
@@ -70,9 +74,9 @@ table {
 .table-bordered {
   border: 1px solid $tableBorder;
   border-collapse: separate; // Done so we can round those corners!
-  *border-collapse: collapsed; // IE7 can't round corners anyway
+  *border-collapse: collapse; // IE7 can't round corners anyway
   border-left: 0;
-  @include bootstrap-border-radius(4px);
+  @include ctb-border-radius($baseBorderRadius);
   th,
   td {
     border-left: 1px solid $tableBorder;
@@ -90,43 +94,62 @@ table {
     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 {
-    -webkit-border-top-left-radius: 4px;
-            border-top-left-radius: 4px;
-        -moz-border-radius-topleft: 4px;
-  }
-  thead:first-child tr:first-child th:last-child,
-  tbody:first-child tr:first-child td:last-child {
-    -webkit-border-top-right-radius: 4px;
-            border-top-right-radius: 4px;
-        -moz-border-radius-topright: 4px;
+  thead:first-child tr:first-child > th:first-child,
+  tbody:first-child tr:first-child > td:first-child {
+    @include ctb-border-top-left-radius($baseBorderRadius);
   }
-  // For first th or td in the first row in the first thead or tbody
-  thead:last-child tr:last-child th:first-child,
-  tbody:last-child tr:last-child td:first-child {
-    @include bootstrap-border-radius(0 0 0 4px);
-    -webkit-border-bottom-left-radius: 4px;
-            border-bottom-left-radius: 4px;
-        -moz-border-radius-bottomleft: 4px;
-  }
-  thead:last-child tr:last-child th:last-child,
-  tbody:last-child tr:last-child td:last-child {
-    -webkit-border-bottom-right-radius: 4px;
-            border-bottom-right-radius: 4px;
-        -moz-border-radius-bottomright: 4px;
+  thead:first-child tr:first-child > th:last-child,
+  tbody:first-child tr:first-child > td:last-child {
+    @include ctb-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 {
+    @include ctb-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 {
+    @include ctb-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 {
+    @include ctb-border-bottom-left-radius(0);
+  }
+  tfoot + tbody:last-child tr:last-child td:last-child {
+    @include ctb-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 {
+    @include ctb-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 {
+    @include ctb-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 {
+    > tr:nth-child(odd) > td,
+    > tr:nth-child(odd) > th {
       background-color: $tableBackgroundAccent;
     }
   }
@@ -136,10 +159,12 @@ table {
 // HOVER EFFECT
 // ------------
 // Placed here since it has to come after the potential zebra striping
-.table {
-  tbody tr:hover td,
-  tbody tr:hover th {
-    background-color: $tableBackgroundHover;
+.table-hover {
+  tbody {
+    tr:hover td,
+    tr:hover th {
+      background-color: $tableBackgroundHover;
+    }
   }
 }
 
@@ -147,30 +172,66 @@ table {
 // TABLE CELL SIZING
 // -----------------
 
-// Change the columns
-table {
-  .span1     { @include bootstrap-tableColumns(1); }
-  .span2     { @include bootstrap-tableColumns(2); }
-  .span3     { @include bootstrap-tableColumns(3); }
-  .span4     { @include bootstrap-tableColumns(4); }
-  .span5     { @include bootstrap-tableColumns(5); }
-  .span6     { @include bootstrap-tableColumns(6); }
-  .span7     { @include bootstrap-tableColumns(7); }
-  .span8     { @include bootstrap-tableColumns(8); }
-  .span9     { @include bootstrap-tableColumns(9); }
-  .span10    { @include bootstrap-tableColumns(10); }
-  .span11    { @include bootstrap-tableColumns(11); }
-  .span12    { @include bootstrap-tableColumns(12); }
-  .span13    { @include bootstrap-tableColumns(13); }
-  .span14    { @include bootstrap-tableColumns(14); }
-  .span15    { @include bootstrap-tableColumns(15); }
-  .span16    { @include bootstrap-tableColumns(16); }
-  .span17    { @include bootstrap-tableColumns(17); }
-  .span18    { @include bootstrap-tableColumns(18); }
-  .span19    { @include bootstrap-tableColumns(19); }
-  .span20    { @include bootstrap-tableColumns(20); }
-  .span21    { @include bootstrap-tableColumns(21); }
-  .span22    { @include bootstrap-tableColumns(22); }
-  .span23    { @include bootstrap-tableColumns(23); }
-  .span24    { @include bootstrap-tableColumns(24); }
+// 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     { @include ctb-tableColumns(1); }
+  &.span2     { @include ctb-tableColumns(2); }
+  &.span3     { @include ctb-tableColumns(3); }
+  &.span4     { @include ctb-tableColumns(4); }
+  &.span5     { @include ctb-tableColumns(5); }
+  &.span6     { @include ctb-tableColumns(6); }
+  &.span7     { @include ctb-tableColumns(7); }
+  &.span8     { @include ctb-tableColumns(8); }
+  &.span9     { @include ctb-tableColumns(9); }
+  &.span10    { @include ctb-tableColumns(10); }
+  &.span11    { @include ctb-tableColumns(11); }
+  &.span12    { @include ctb-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%);
+  }
 }