compass_twitter_bootstrap 2.0.1.2 → 2.0.3

data/stylesheets/compass_twitter_bootstrap/_tables.scss

@@ -9,6 +9,7 @@
 
 table {
   max-width: 100%;
+  background-color: $tableBackground;
   border-collapse: collapse;
   border-spacing: 0;
 }
@@ -26,7 +27,7 @@ table {
     line-height: $baseLineHeight;
     text-align: left;
     vertical-align: top;
-    border-top: 1px solid #ddd;
+    border-top: 1px solid $tableBorder;
   }
   th {
     font-weight: bold;
@@ -36,13 +37,17 @@ table {
     vertical-align: bottom;
   }
   // Remove top border from thead by default
-  thead:first-child tr th,
-  thead:first-child tr td {
+  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 #ddd;
+    border-top: 2px solid $tableBorder;
   }
 }
 
@@ -63,17 +68,22 @@ table {
 // ----------------
 
 .table-bordered {
-  border: 1px solid #ddd;
+  border: 1px solid $tableBorder;
   border-collapse: separate; // Done so we can round those corners!
   *border-collapse: collapsed; // IE7 can't round corners anyway
-  @include border-radius(4px);
-  th + th,
-  td + td,
-  th + td,
-  td + th {
-    border-left: 1px solid #ddd;
+  border-left: 0;
+  @include bootstrap-border-radius(4px);
+  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 {
@@ -82,20 +92,29 @@ table {
   // 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 {
-    @include border-radius(4px 0 0 0);
+    -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 {
-    @include border-radius(0 4px 0 0);
+    -webkit-border-top-right-radius: 4px;
+            border-top-right-radius: 4px;
+        -moz-border-radius-topright: 4px;
   }
   // 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 border-radius(0 0 0 4px);
+    @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 {
-    @include border-radius(0 0 4px 0);
+    -webkit-border-bottom-right-radius: 4px;
+            border-bottom-right-radius: 4px;
+        -moz-border-radius-bottomright: 4px;
   }
 }
 
@@ -108,7 +127,7 @@ table {
   tbody {
     tr:nth-child(odd) td,
     tr:nth-child(odd) th {
-      background-color: #f9f9f9;
+      background-color: $tableBackgroundAccent;
     }
   }
 }
@@ -120,7 +139,7 @@ table {
 .table {
   tbody tr:hover td,
   tbody tr:hover th {
-    background-color: #f5f5f5;
+    background-color: $tableBackgroundHover;
   }
 }
 
@@ -129,22 +148,29 @@ table {
 // -----------------
 
 // Change the columns
-@mixin tableColumns($columnSpan: 1) {
-  float: none;
-  width: (($gridColumnWidth) * $columnSpan) + ($gridGutterWidth * ($columnSpan - 1)) - 16;
-  margin-left: 0;
-}
 table {
-  .span1     { @include tableColumns(1); }
-  .span2     { @include tableColumns(2); }
-  .span3     { @include tableColumns(3); }
-  .span4     { @include tableColumns(4); }
-  .span5     { @include tableColumns(5); }
-  .span6     { @include tableColumns(6); }
-  .span7     { @include tableColumns(7); }
-  .span8     { @include tableColumns(8); }
-  .span9     { @include tableColumns(9); }
-  .span10    { @include tableColumns(10); }
-  .span11    { @include tableColumns(11); }
-  .span12    { @include tableColumns(12); }
+  .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); }
 }

data/stylesheets/compass_twitter_bootstrap/_thumbnails.scss

@@ -1,28 +1,40 @@
 // THUMBNAILS
 // ----------
+// Note: `.thumbnails` and `.thumbnails > li` are overriden in responsive files
 
+// Make wrapper ul behave like the grid
 .thumbnails {
   margin-left: -$gridGutterWidth;
   list-style: none;
-  @include clearfix();
+  @include bootstrap-clearfix();
 }
+// Fluid rows have no left margin
+.row-fluid .thumbnails {
+  margin-left: 0;
+}
+
+// Float li to make thumbnails appear in a row
 .thumbnails > li {
-  float: left;
-  margin: 0 0 $baseLineHeight $gridGutterWidth;
+  float: left; // Explicity set the float since we don't require .span* classes
+  margin-bottom: $baseLineHeight;
+  margin-left: $gridGutterWidth;
 }
+
+// The actual thumbnail (can be `a` or `div`)
 .thumbnail {
   display: block;
   padding: 4px;
   line-height: 1;
   border: 1px solid #ddd;
-  @include border-radius(4px);
-  @include box-shadow(0 1px 1px rgba(0,0,0,.075));
+  @include bootstrap-border-radius(4px);
+  @include bootstrap-box-shadow(0 1px 1px rgba(0,0,0,.075));
 }
 // Add a hover state for linked versions only
 a.thumbnail:hover {
   border-color: $linkColor;
-  @include box-shadow(0 1px 4px rgba(0,105,214,.25));
+  @include bootstrap-box-shadow(0 1px 4px rgba(0,105,214,.25));
 }
+
 // Images and captions
 .thumbnail > img {
   display: block;

data/stylesheets/compass_twitter_bootstrap/_tooltip.scss

@@ -8,16 +8,16 @@
   visibility: visible;
   padding: 5px;
   font-size: 11px;
-  @include opacity(0.0);
-  &.in     { @include opacity(0.8); }
+  @include bootstrap-opacity(0);
+  &.in     { @include bootstrap-opacity(80); }
   &.top    { margin-top:  -2px; }
   &.right  { margin-left:  2px; }
   &.bottom { margin-top:   2px; }
   &.left   { margin-left: -2px; }
-  &.top .tooltip-arrow    { @include popoverArrow-top(); }
-  &.left .tooltip-arrow   { @include popoverArrow-left(); }
-  &.bottom .tooltip-arrow { @include popoverArrow-bottom(); }
-  &.right .tooltip-arrow  { @include popoverArrow-right(); }
+  &.top .tooltip-arrow    { @include bootstrap-popoverArrow-top(); }
+  &.left .tooltip-arrow   { @include bootstrap-popoverArrow-left(); }
+  &.bottom .tooltip-arrow { @include bootstrap-popoverArrow-bottom(); }
+  &.right .tooltip-arrow  { @include bootstrap-popoverArrow-right(); }
 }
 .tooltip-inner {
   max-width: 200px;
@@ -26,7 +26,7 @@
   text-align: center;
   text-decoration: none;
   background-color: $black;
-  @include border-radius(4px);
+  @include bootstrap-border-radius(4px);
 }
 .tooltip-arrow {
   position: absolute;

data/stylesheets/compass_twitter_bootstrap/_type.scss

@@ -28,8 +28,9 @@ p {
 
 h1, h2, h3, h4, h5, h6 {
   margin: 0;
-  font-weight: bold;
-  color: $grayDark;
+  font-family: $headingsFontFamily;
+  font-weight: $headingsFontWeight;
+  color: $headingsColor;
   text-rendering: optimizelegibility; // Fix the character spacing for headings
   small {
     font-weight: normal;
@@ -51,8 +52,8 @@ h2 {
   }
 }
 h3 {
-  line-height: $baseLineHeight * 1.5;
   font-size: 18px;
+  line-height: $baseLineHeight * 1.5;
   small {
     font-size: 14px;
   }
@@ -126,10 +127,24 @@ dd {
 }
 dt {
   font-weight: bold;
+  line-height: $baseLineHeight - 1; // fix jank Helvetica Neue font bug
 }
 dd {
   margin-left: $baseLineHeight / 2;
 }
+// Horizontal layout (like forms)
+.dl-horizontal {
+  dt {
+    float: left;
+    width: 120px;
+    clear: left;
+    text-align: right;
+    @include bootstrap-text-overflow();
+  }
+  dd {
+    margin-left: 130px;
+  }
+}
 
 // MISC
 // ----
@@ -154,11 +169,13 @@ em {
 }
 
 // Abbreviations and acronyms
-abbr {
+abbr[title] {
+  cursor: help;
+  border-bottom: 1px dotted #ddd;
+}
+abbr.initialism {
   font-size: 90%;
   text-transform: uppercase;
-  border-bottom: 1px dotted #ddd;
-  cursor: help;
 }
 
 // Blockquotes
@@ -168,7 +185,7 @@ blockquote {
   border-left: 5px solid $grayLighter;
   p {
     margin-bottom: 0;
-    @include font-shorthand(16px,300,$baseLineHeight * 1.25);
+    @include bootstrap-font-shorthand(16px,300,$baseLineHeight * 1.25);
   }
   small {
     display: block;
@@ -182,10 +199,10 @@ blockquote {
   // Float right with text-align: right
   &.pull-right {
     float: right;
-    padding-left: 0;
     padding-right: 15px;
-    border-left: 0;
+    padding-left: 0;
     border-right: 5px solid $grayLighter;
+    border-left: 0;
     p,
     small {
       text-align: right;
@@ -196,7 +213,7 @@ blockquote {
 // Quotes
 q:before,
 q:after,
-blockquote:before, 
+blockquote:before,
 blockquote:after {
   content: "";
 }
@@ -205,8 +222,8 @@ blockquote:after {
 address {
   display: block;
   margin-bottom: $baseLineHeight;
-  line-height: $baseLineHeight;
   font-style: normal;
+  line-height: $baseLineHeight;
 }
 
 // Misc

data/stylesheets/compass_twitter_bootstrap/_variables.scss

@@ -7,11 +7,9 @@
 // GLOBAL VALUES
 // --------------------------------------------------
 
-// Links
-$linkColor:             #08c !default;
-$linkColorHover:        darken($linkColor, 15%) !default;
 
 // Grays
+// -------------------------
 $black:                 #000 !default;
 $grayDarker:            #222 !default;
 $grayDark:              #333 !default;
@@ -20,7 +18,9 @@ $grayLight:             #999 !default;
 $grayLighter:           #eee !default;
 $white:                 #fff !default;
 
+
 // Accent colors
+// -------------------------
 $blue:                  #049cdb !default;
 $blueDark:              #0064cd !default;
 $green:                 #46a546 !default;
@@ -30,14 +30,84 @@ $orange:                #f89406 !default;
 $pink:                  #c3325f !default;
 $purple:                #7a43b6 !default;
 
+
+// Scaffolding
+// -------------------------
+$bodyBackground:        $white !default;
+$textColor:             $grayDark !default;
+
+
+// Links
+// -------------------------
+$linkColor:             #08c !default;
+$linkColorHover:        darken($linkColor, 15%) !default;
+
+
 // Typography
+// -------------------------
+$sansFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif !default;
+$serifFontFamily:       Georgia, "Times New Roman", Times, serif !default;
+$monoFontFamily:        Menlo, Monaco, Consolas, "Courier New", monospace !default;
+
 $baseFontSize:          13px !default;
-$baseFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif !default;
+$baseFontFamily:        $sansFontFamily !default;
 $baseLineHeight:        18px !default;
-$textColor:             $grayDark !default;
+$altFontFamily:         $serifFontFamily !default;
+
+$headingsFontFamily:    inherit !default; // empty to use BS default, $baseFontFamily
+$headingsFontWeight:    bold !default;    // instead of browser default, bold
+$headingsColor:         inherit !default; // empty to use BS default, $textColor
+
+
+// Tables
+// -------------------------
+$tableBackground:                   transparent !default; // overall background-color
+$tableBackgroundAccent:             #f9f9f9 !default; // for striping
+$tableBackgroundHover:              #f5f5f5 !default; // for hover
+$tableBorder:                       #ddd !default; // table and cell border
+
 
 // Buttons
-$primaryButtonBackground:    $linkColor !default;
+// -------------------------
+$btnBackground:                     $white !default;
+$btnBackgroundHighlight:            darken($white, 10%) !default;
+$btnBorder:                         #ccc !default;
+
+$btnPrimaryBackground:              $linkColor !default;
+$btnPrimaryBackgroundHighlight:     adjust-hue($btnPrimaryBackground, 15%) !default;
+
+$btnInfoBackground:                 #5bc0de !default;
+$btnInfoBackgroundHighlight:        #2f96b4 !default;
+
+$btnSuccessBackground:              #62c462 !default;
+$btnSuccessBackgroundHighlight:     #51a351 !default;
+
+$btnWarningBackground:              lighten($orange, 15%) !default;
+$btnWarningBackgroundHighlight:     $orange !default;
+
+$btnDangerBackground:               #ee5f5b !default;
+$btnDangerBackgroundHighlight:      #bd362f !default;
+
+$btnInverseBackground:              $gray !default;
+$btnInverseBackgroundHighlight:     $grayDarker !default;
+
+
+// Forms
+// -------------------------
+$inputBackground:               $white !default;
+$inputBorder:                   #ccc !default;
+$inputBorderRadius:             3px !default;
+$inputDisabledBackground:       $grayLighter !default;
+$formActionsBackground:         #f5f5f5 !default;
+
+// Dropdowns
+// -------------------------
+$dropdownBackground:            $white !default;
+$dropdownBorder:                rgba(0,0,0,.2) !default;
+$dropdownLinkColor:             $grayDark !default;
+$dropdownLinkColorHover:        $white !default;
+$dropdownLinkBackgroundHover:   $linkColor !default;
+
 
 
 
@@ -45,6 +115,7 @@ $primaryButtonBackground:    $linkColor !default;
 // --------------------------------------------------
 
 // Z-index master list
+// -------------------------
 // Used for a bird's eye view of components dependent on the z-axis
 // Try to avoid customizing these :)
 $zindexDropdown:          1000 !default;
@@ -54,27 +125,52 @@ $zindexFixedNavbar:       1030 !default;
 $zindexModalBackdrop:     1040 !default;
 $zindexModal:             1050 !default;
 
+
 // Sprite icons path
-$iconSpritePath:          "glyphicons-halflings.png" !default;
-$iconWhiteSpritePath:     "glyphicons-halflings-white.png" !default;
+// -------------------------
+$iconSpritePath:          "../img/glyphicons-halflings.png" !default;
+$iconWhiteSpritePath:     "../img/glyphicons-halflings-white.png" !default;
+
 
 // Input placeholder text color
+// -------------------------
 $placeholderText:         $grayLight !default;
 
+
 // Hr border color
+// -------------------------
 $hrBorder:                $grayLighter !default;
 
+
 // Navbar
+// -------------------------
 $navbarHeight:                    40px !default;
 $navbarBackground:                $grayDarker !default;
 $navbarBackgroundHighlight:       $grayDark !default;
-$navbarLinkBackgroundHover:       transparent !default;
 
 $navbarText:                      $grayLight !default;
 $navbarLinkColor:                 $grayLight !default;
 $navbarLinkColorHover:            $white !default;
+$navbarLinkColorActive:           $navbarLinkColorHover !default;
+$navbarLinkBackgroundHover:       transparent !default;
+$navbarLinkBackgroundActive:      $navbarBackground !default;
+
+$navbarSearchBackground:          lighten($navbarBackground, 25%) !default;
+$navbarSearchBackgroundFocus:     $white !default;
+$navbarSearchBorder:              darken($navbarSearchBackground, 30%) !default;
+$navbarSearchPlaceholderColor:    #ccc !default;
+$navbarBrandColor:                $navbarLinkColor !default;
+
+
+// Hero unit
+// -------------------------
+$heroUnitBackground:              $grayLighter !default;
+$heroUnitHeadingColor:            inherit !default;
+$heroUnitLeadColor:               inherit !default;
+
 
 // Form states and alerts
+// -------------------------
 $warningText:             #c09853 !default;
 $warningBackground:       #fcf8e3 !default;
 $warningBorder:           darken(adjust-hue($warningBackground, -10), 3%) !default;
@@ -97,11 +193,13 @@ $infoBorder:              darken(adjust-hue($infoBackground, -10), 7%) !default;
 // --------------------------------------------------
 
 // Default 940px grid
+// -------------------------
 $gridColumns:             12 !default;
 $gridColumnWidth:         60px !default;
 $gridGutterWidth:         20px !default;
 $gridRowWidth:            ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1)) !default;
 
 // Fluid grid
+// -------------------------
 $fluidGridColumnWidth:    6.382978723% !default;
 $fluidGridGutterWidth:    2.127659574% !default;