compass_twitter_bootstrap 0.1.8 → 2.0.0

data/stylesheets/compass_twitter_bootstrap/_tooltip.scss

@@ -0,0 +1,35 @@
+// TOOLTIP
+// ------=
+
+.tooltip {
+  position: absolute;
+  z-index: $zindexTooltip;
+  display: block;
+  visibility: visible;
+  padding: 5px;
+  font-size: 11px;
+  @include opacity(0.0);
+  &.in     { @include opacity(0.8); }
+  &.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(); }
+}
+.tooltip-inner {
+  max-width: 200px;
+  padding: 3px 8px;
+  color: $white;
+  text-align: center;
+  text-decoration: none;
+  background-color: $black;
+  @include border-radius(4px);
+}
+.tooltip-arrow {
+  position: absolute;
+  width: 0;
+  height: 0;
+}

data/stylesheets/compass_twitter_bootstrap/_type.scss

@@ -1,77 +1,99 @@
-/* Typography.less
- * Headings, body text, lists, code, and more for a versatile and durable typography system
- * ---------------------------------------------------------------------------------------- */
+// Typography.less
+// Headings, body text, lists, code, and more for a versatile and durable typography system
+// ----------------------------------------------------------------------------------------
 
 
 // BODY TEXT
 // ---------
 
 p {
-  @include shorthand(normal,$basefont,$baseline);
-  margin-bottom: $baseline / 2;
+  margin: 0 0 $baseLineHeight / 2;
+  font-family: $baseFontFamily;
+  font-size: $baseFontSize;
+  line-height: $baseLineHeight;
   small {
-    font-size: $basefont - 2;
+    font-size: $baseFontSize - 2;
     color: $grayLight;
   }
 }
-
+.lead {
+  margin-bottom: $baseLineHeight;
+  font-size: 20px;
+  font-weight: 200;
+  line-height: $baseLineHeight * 1.5;
+}
 
 // HEADINGS
 // --------
 
 h1, h2, h3, h4, h5, h6 {
+  margin: 0;
   font-weight: bold;
   color: $grayDark;
+  text-rendering: optimizelegibility; // Fix the character spacing for headings
   small {
+    font-weight: normal;
     color: $grayLight;
   }
 }
 h1 {
-  margin-bottom: $baseline;
   font-size: 30px;
-  line-height: $baseline * 2;
+  line-height: $baseLineHeight * 2;
   small {
     font-size: 18px;
   }
 }
 h2 {
   font-size: 24px;
-  line-height: $baseline * 2;
+  line-height: $baseLineHeight * 2;
   small {
-    font-size: 14px;
+    font-size: 18px;
   }
 }
-h3, h4, h5, h6 {
-  line-height: $baseline * 2;
-}
 h3 {
+  line-height: $baseLineHeight * 1.5;
   font-size: 18px;
   small {
     font-size: 14px;
   }
 }
+h4, h5, h6 {
+  line-height: $baseLineHeight;
+}
 h4 {
-  font-size: 16px;
+  font-size: 14px;
   small {
     font-size: 12px;
   }
 }
 h5 {
-  font-size: 14px;
+  font-size: 12px;
 }
 h6 {
-  font-size: 13px;
+  font-size: 11px;
   color: $grayLight;
   text-transform: uppercase;
 }
 
+// Page header
+.page-header {
+  padding-bottom: $baseLineHeight - 1;
+  margin: $baseLineHeight 0;
+  border-bottom: 1px solid $grayLighter;
+}
+.page-header h1 {
+  line-height: 1;
+}
+
+
 
-// COLORS
-// ------
+// LISTS
+// -----
 
 // Unordered and Ordered lists
 ul, ol {
-  margin: 0 0 $baseline 25px;
+  padding: 0;
+  margin: 0 0 $baseLineHeight / 2 25px;
 }
 ul ul,
 ul ol,
@@ -86,26 +108,26 @@ ol {
   list-style: decimal;
 }
 li {
-  line-height: $baseline;
-  color: $gray;
+  line-height: $baseLineHeight;
 }
 ul.unstyled {
-  list-style: none;
   margin-left: 0;
+  list-style: none;
 }
 
 // Description Lists
 dl {
-  margin-bottom: $baseline;
-  dt, dd {
-    line-height: $baseline;
-  }
-  dt {
-    font-weight: bold;
-  }
-  dd {
-    margin-left: $baseline / 2;
-  }
+  margin-bottom: $baseLineHeight;
+}
+dt,
+dd {
+  line-height: $baseLineHeight;
+}
+dt {
+  font-weight: bold;
+}
+dd {
+  margin-left: $baseLineHeight / 2;
 }
 
 // MISC
@@ -113,75 +135,83 @@ dl {
 
 // Horizontal rules
 hr {
-  margin: 20px 0 19px;
+  margin: $baseLineHeight 0;
   border: 0;
-  border-bottom: 1px solid #eee;
+  border-top: 1px solid #e5e5e5;
+  border-bottom: 1px solid $white;
 }
 
 // Emphasis
 strong {
-  font-style: inherit;
   font-weight: bold;
 }
 em {
   font-style: italic;
-  font-weight: inherit;
-  line-height: inherit;
 }
 .muted {
   color: $grayLight;
 }
 
+// Abbreviations and acronyms
+abbr {
+  font-size: 90%;
+  text-transform: uppercase;
+  border-bottom: 1px dotted #ddd;
+  cursor: help;
+}
+
 // Blockquotes
 blockquote {
-  margin-bottom: $baseline;
-  border-left: 5px solid #eee;
-  padding-left: 15px;
+  padding: 0 0 0 15px;
+  margin: 0 0 $baseLineHeight;
+  border-left: 5px solid $grayLighter;
   p {
-    @include shorthand(300,14px,$baseline);
     margin-bottom: 0;
+    @include font-shorthand(16px,300,$baseLineHeight * 1.25);
   }
   small {
     display: block;
-    @include shorthand(300,12px,$baseline);
+    line-height: $baseLineHeight;
     color: $grayLight;
     &:before {
       content: '\2014 \00A0';
     }
   }
+
+  // Float right with text-align: right
+  &.pull-right {
+    float: right;
+    padding-left: 0;
+    padding-right: 15px;
+    border-left: 0;
+    border-right: 5px solid $grayLighter;
+    p,
+    small {
+      text-align: right;
+    }
+  }
+}
+
+// Quotes
+q:before,
+q:after,
+blockquote:before, 
+blockquote:after {
+  content: "";
 }
 
 // Addresses
 address {
   display: block;
-  line-height: $baseline;
-  margin-bottom: $baseline;
+  margin-bottom: $baseLineHeight;
+  line-height: $baseLineHeight;
+  font-style: normal;
 }
 
-// Inline and block code styles
-code, pre {
-  padding: 0 3px 2px;
-  font-family: Monaco, Andale Mono, Courier New, monospace;
-  font-size: 12px;
-  @include border-radius(3px);
+// Misc
+small {
+  font-size: 100%;
 }
-code {
-  background-color: lighten($orange, 40%);
-  color: rgba(0,0,0,.75);
-  padding: 1px 3px;
+cite {
+  font-style: normal;
 }
-pre {
-  background-color: #f5f5f5;
-  display: block;
-  padding: ($baseline - 1) / 2;
-  margin: 0 0 $baseline;
-  line-height: $baseline;
-  font-size: 12px;
-  border: 1px solid #ccc;
-  border: 1px solid rgba(0,0,0,.15);
-  @include border-radius(3px);
-  white-space: pre;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-
-}

data/stylesheets/compass_twitter_bootstrap/_utilities.scss

@@ -0,0 +1,23 @@
+// UTILITY CLASSES
+// ---------------
+
+// Quick floats
+.pull-right {
+  float: right;
+}
+.pull-left {
+  float: left;
+}
+
+// Toggling content
+.hide {
+  display: none;
+}
+.show {
+  display: block;
+}
+
+// Visibility
+.invisible {
+  visibility: hidden;
+}

data/stylesheets/compass_twitter_bootstrap/_variables.scss

@@ -1,60 +1,99 @@
-/* Variables.less
- * Variables to customize the look and feel of Bootstrap
- * ----------------------------------------------------- */
+// Variables.less
+// Variables to customize the look and feel of Bootstrap
+// -----------------------------------------------------
 
 
+
+// GLOBAL VALUES
+// --------------------------------------------------
+
 // Links
-$linkColor:         #0069d6;
-$linkColorHover:    darken($linkColor, 15);
+$linkColor:             #08c;
+$linkColorHover:        darken($linkColor, 15%);
 
 // Grays
-$black:             #000;
-$grayDark:          lighten($black, 25%);
-$gray:              lighten($black, 50%);
-$grayLight:         lighten($black, 75%);
-$grayLighter:       lighten($black, 90%);
-$white:             #fff;
-
-// Accent Colors
-$blue:              #049CDB;
-$blueDark:          #0064CD;
-$green:             #46a546;
-$red:               #9d261d;
-$yellow:            #ffc40d;
-$orange:            #f89406;
-$pink:              #c3325f;
-$purple:            #7a43b6;
-
-// Baseline grid
-$basefont:          13px;
-$baseline:          18px;
-
-// Griditude
-// Modify the grid styles in mixins.less
-$gridColumns:       16;
-$gridColumnWidth:   40px;
-$gridGutterWidth:   20px;
-$extraSpace:        ($gridGutterWidth * 2); // For our grid calculations
-$siteWidth:         ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1));
-
-// Color Scheme
-// Use this to roll your own color schemes if you like (unused by Bootstrap by default)
-$baseColor:         $blue;                  // Set a base color
-$complement:        adjust-hue($baseColor, 180);  // Determine a complementary color
-$split1:            adjust-hue($baseColor, 158);  // Split complements
-$split2:            adjust-hue($baseColor, -158);
-$triad1:            adjust-hue($baseColor, 135);  // Triads colors
-$triad2:            adjust-hue($baseColor, -135);
-$tetra1:            adjust-hue($baseColor, 90);   // Tetra colors
-$tetra2:            adjust-hue($baseColor, -90);
-$analog1:           adjust-hue($baseColor, 22);   // Analogs colors
-$analog2:           adjust-hue($baseColor, -22);
-
-
-
-// More variables coming soon:
-// - $basefont to $baseFontSize
-// - $baseline to $baseLineHeight
-// - $baseFontFamily
-// - $primaryButtonColor
-// - anything else? File an issue on GitHub
+$black:                 #000;
+$grayDarker:            #222;
+$grayDark:              #333;
+$gray:                  #555;
+$grayLight:             #999;
+$grayLighter:           #eee;
+$white:                 #fff;
+
+// Accent colors
+$blue:                  #049cdb;
+$blueDark:              #0064cd;
+$green:                 #46a546;
+$red:                   #9d261d;
+$yellow:                #ffc40d;
+$orange:                #f89406;
+$pink:                  #c3325f;
+$purple:                #7a43b6;
+
+// Typography
+$baseFontSize:          13px;
+$baseFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif;
+$baseLineHeight:        18px;
+$textColor:             $grayDark;
+
+// Buttons
+$primaryButtonBackground:    $linkColor;
+
+
+
+// COMPONENT VARIABLES
+// --------------------------------------------------
+
+// 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;
+$zindexPopover:         1010;
+$zindexTooltip:         1020;
+$zindexFixedNavbar:     1030;
+$zindexModalBackdrop:   1040;
+$zindexModal:           1050;
+
+// Input placeholder text color
+$placeholderText:       $grayLight;
+
+// Navbar
+$navbarHeight:                    40px;
+$navbarBackground:                $grayDarker;
+$navbarBackgroundHighlight:       $grayDark;
+
+$navbarText:                      $grayLight;
+$navbarLinkColor:                 $grayLight;
+$navbarLinkColorHover:            $white;
+
+// Form states and alerts
+$warningText:             #c09853;
+$warningBackground:       #fcf8e3;
+$warningBorder:           darken(adjust-hue($warningBackground, -10), 3%);
+
+$errorText:               #b94a48;
+$errorBackground:         #f2dede;
+$errorBorder:             darken(adjust-hue($errorBackground, -10), 3%);
+
+$successText:             #468847;
+$successBackground:       #dff0d8;
+$successBorder:           darken(adjust-hue($successBackground, -10), 5%);
+
+$infoText:                #3a87ad;
+$infoBackground:          #d9edf7;
+$infoBorder:              darken(adjust-hue($infoBackground, -10), 7%);
+
+
+
+// GRID
+// --------------------------------------------------
+
+// Default 940px grid
+$gridColumns:             12;
+$gridColumnWidth:         60px;
+$gridGutterWidth:         20px;
+$gridRowWidth:            ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1));
+
+// Fluid grid
+$fluidGridColumnWidth:    6.382978723%;
+$fluidGridGutterWidth:    2.127659574%;