compass_twitter_bootstrap 2.0.3 → 2.2.2

data/stylesheets/compass_twitter_bootstrap/_wells.scss

@@ -1,15 +1,17 @@
-// WELLS
-// -----
+//
+// Wells
+// --------------------------------------------------
 
+
+// Base class
 .well {
   min-height: 20px;
   padding: 19px;
   margin-bottom: 20px;
-  background-color: #f5f5f5;
-  border: 1px solid #eee;
-  border: 1px solid rgba(0,0,0,.05);
-  @include bootstrap-border-radius(4px);
-  @include bootstrap-box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
+  background-color: $wellBackground;
+  border: 1px solid darken($wellBackground, 7%);
+  @include ctb-border-radius($baseBorderRadius);
+  @include ctb-box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
   blockquote {
     border-color: #ddd;
     border-color: rgba(0,0,0,.15);
@@ -19,10 +21,9 @@
 // Sizes
 .well-large {
   padding: 24px;
-  @include bootstrap-border-radius(6px);
+  @include ctb-border-radius($borderRadiusLarge);
 }
 .well-small {
   padding: 9px;
-  @include bootstrap-border-radius(3px);
+  @include ctb-border-radius($borderRadiusSmall);
 }
-

data/stylesheets_sass/_compass_twitter_bootstrap.sass

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap v2.0.3
+ * Bootstrap v2.1.0
  *
  * Copyright 2012 Twitter, Inc
  * Licensed under the Apache License v2.0
@@ -58,6 +58,7 @@
 
 // Components: Misc
 @import compass_twitter_bootstrap/thumbnails
+@import compass_twitter_bootstrap/media
 @import compass_twitter_bootstrap/labels-badges
 @import compass_twitter_bootstrap/progress-bars
 @import compass_twitter_bootstrap/accordion

data/stylesheets_sass/_compass_twitter_bootstrap_awesome.sass

@@ -1,5 +1,5 @@
 /*
- * Bootstrap v2.0.3
+ * Bootstrap v2.1.0
  *
  * Copyright 2012 Twitter, Inc
  * Licensed under the Apache License v2.0

data/stylesheets_sass/_compass_twitter_bootstrap_responsive.sass

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Responsive v2.0.3
+ * Bootstrap Responsive v2.1.0
  *
  * Copyright 2012 Twitter, Inc
  * Licensed under the Apache License v2.0

data/stylesheets_sass/compass_twitter_bootstrap/_accordion.sass

@@ -1,5 +1,6 @@
-// ACCORDION
-// ---------
+//
+// Accordion
+// --------------------------------------------------
 
 // Parent container
 .accordion
@@ -9,7 +10,7 @@
 .accordion-group
   margin-bottom: 2px
   border: 1px solid #e5e5e5
-  +bootstrap-border-radius(4px)
+  +ctb-border-radius($baseBorderRadius)
 
 .accordion-heading
   border-bottom: 0

data/stylesheets_sass/compass_twitter_bootstrap/_alerts.sass

@@ -1,47 +1,65 @@
-// ALERT STYLES
-// ------------
+//
+// Alerts
+// --------------------------------------------------
+
+// Base styles
+// -------------------------
 
-// Base alert styles
 .alert
   padding: 8px 35px 8px 14px
   margin-bottom: $baseLineHeight
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5)
   background-color: $warningBackground
   border: 1px solid $warningBorder
-  +bootstrap-border-radius(4px)
+  +ctb-border-radius($baseBorderRadius)
+
+.alert,
+.alert h4
+  // Specified for the h4 to prevent conflicts of changing $headingsColor
   color: $warningText
 
-.alert-heading
-  color: inherit
+.alert h4
+  margin: 0
 
 // Adjust close link position
 .alert .close
   position: relative
   top: -2px
   right: -21px
-  line-height: 18px
+  line-height: $baseLineHeight
 
 // Alternate styles
-// ----------------
+// -------------------------
 
 .alert-success
   background-color: $successBackground
   border-color: $successBorder
   color: $successText
 
+.alert-success h4
+  color: $successText
+
 .alert-danger,
 .alert-error
   background-color: $errorBackground
   border-color: $errorBorder
   color: $errorText
 
+.alert-danger h4,
+.alert-error h4
+  color: $errorText
+
 .alert-info
   background-color: $infoBackground
   border-color: $infoBorder
   color: $infoText
 
+.alert-info h4
+  color: $infoText
+
 // Block alerts
-// ------------------------
+// -------------------------
+
 .alert-block
   padding-top: 14px
   padding-bottom: 14px

data/stylesheets_sass/compass_twitter_bootstrap/_breadcrumbs.sass

@@ -1,20 +1,19 @@
-// BREADCRUMBS
-// -----------
+//
+// Breadcrumbs
+// --------------------------------------------------
 
 .breadcrumb
-  padding: 7px 14px
+  padding: 8px 15px
   margin: 0 0 $baseLineHeight
   list-style: none
-  +bootstrap-gradient-vertical($white, #f5f5f5)
-  border: 1px solid #ddd
-  +bootstrap-border-radius(3px)
-  +bootstrap-box-shadow(inset 0 1px 0 $white)
-  li
+  background-color: #f5f5f5
+  +ctb-border-radius($baseBorderRadius)
+  > li
     display: inline-block
-    +bootstrap-ie7-inline-block
+    +ctb-ie7-inline-block
     text-shadow: 0 1px 0 $white
-  .divider
-    padding: 0 5px
+    > .divider
+      padding: 0 5px
+      color: #ccc
+  > .active
     color: $grayLight
-  .active a
-    color: $grayDark

data/stylesheets_sass/compass_twitter_bootstrap/_button-groups.sass

@@ -1,12 +1,19 @@
-// BUTTON GROUPS
-// -------------
+//
+// Button groups
+// --------------------------------------------------
 
 // Make the div behave like a button
 .btn-group
   position: relative
-  +bootstrap-clearfix
-  // clears the floated buttons
-  +bootstrap-ie7-restore-left-whitespace
+  display: inline-block
+  +ctb-ie7-inline-block
+  font-size: 0
+  // remove as part 1 of font-size inline-block hack
+  vertical-align: middle
+  // match .btn alignment given font-size hack above
+  white-space: nowrap
+  // prevent buttons from wrapping when in tight spaces (e.g., the table on the tests page)
+  +ctb-ie7-restore-left-whitespace
 
 // Space out series of button groups
 .btn-group + .btn-group
@@ -14,58 +21,62 @@
 
 // Optional: Group multiple button groups together for a toolbar
 .btn-toolbar
+  font-size: 0
+  // Hack to remove whitespace that results from using inline-block
   margin-top: $baseLineHeight / 2
   margin-bottom: $baseLineHeight / 2
-  .btn-group
-    display: inline-block
-    +bootstrap-ie7-inline-block
+  > .btn + .btn,
+  > .btn-group + .btn,
+  > .btn + .btn-group
+    margin-left: 5px
 
 // Float them, remove border radius, then re-add to first and last elements
 .btn-group > .btn
   position: relative
-  float: left
+  +ctb-border-radius(0)
+
+.btn-group > .btn + .btn
   margin-left: -1px
-  +bootstrap-border-radius(0)
+
+.btn-group > .btn,
+.btn-group > .dropdown-menu,
+.btn-group > .popover
+  font-size: $baseFontSize
+  // redeclare as part 2 of font-size inline-block hack
+
+// Reset fonts for other sizes
+.btn-group > .btn-mini
+  font-size: $fontSizeMini
+
+.btn-group > .btn-small
+  font-size: $fontSizeSmall
+
+.btn-group > .btn-large
+  font-size: $fontSizeLarge
 
 // Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
 .btn-group > .btn:first-child
   margin-left: 0
-  -webkit-border-top-left-radius: 4px
-  -moz-border-radius-topleft: 4px
-  border-top-left-radius: 4px
-  -webkit-border-bottom-left-radius: 4px
-  -moz-border-radius-bottomleft: 4px
-  border-bottom-left-radius: 4px
+  +ctb-border-top-left-radius($baseBorderRadius)
+  +ctb-border-bottom-left-radius($baseBorderRadius)
 
 // Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it
 
 .btn-group > .btn:last-child,
 .btn-group > .dropdown-toggle
-  -webkit-border-top-right-radius: 4px
-  -moz-border-radius-topright: 4px
-  border-top-right-radius: 4px
-  -webkit-border-bottom-right-radius: 4px
-  -moz-border-radius-bottomright: 4px
-  border-bottom-right-radius: 4px
+  +ctb-border-top-right-radius($baseBorderRadius)
+  +ctb-border-bottom-right-radius($baseBorderRadius)
 
 // Reset corners for large buttons
 .btn-group > .btn.large:first-child
   margin-left: 0
-  -webkit-border-top-left-radius: 6px
-  -moz-border-radius-topleft: 6px
-  border-top-left-radius: 6px
-  -webkit-border-bottom-left-radius: 6px
-  -moz-border-radius-bottomleft: 6px
-  border-bottom-left-radius: 6px
+  +ctb-border-top-left-radius($borderRadiusLarge)
+  +ctb-border-bottom-left-radius($borderRadiusLarge)
 
 .btn-group > .btn.large:last-child,
 .btn-group > .large.dropdown-toggle
-  -webkit-border-top-right-radius: 6px
-  -moz-border-radius-topright: 6px
-  border-top-right-radius: 6px
-  -webkit-border-bottom-right-radius: 6px
-  -moz-border-radius-bottomright: 6px
-  border-bottom-right-radius: 6px
+  +ctb-border-top-right-radius($borderRadiusLarge)
+  +ctb-border-bottom-right-radius($borderRadiusLarge)
 
 // On hover/focus/active, bring the proper btn to front
 
@@ -85,31 +96,35 @@
 // ----------------------
 
 // Give the line between buttons some depth
-.btn-group > .dropdown-toggle
+.btn-group > .btn + .dropdown-toggle
   padding-left: 8px
   padding-right: 8px
-  +bootstrap-box-shadow("inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)")
-  *padding-top: 4px
-  *padding-bottom: 4px
+  +ctb-box-shadow(#{inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05)})
+  *padding-top: 5px
+  *padding-bottom: 5px
 
-.btn-group > .btn-mini.dropdown-toggle
+.btn-group > .btn-mini + .dropdown-toggle
   padding-left: 5px
   padding-right: 5px
+  *padding-top: 2px
+  *padding-bottom: 2px
 
-.btn-group > .btn-small.dropdown-toggle
-  *padding-top: 4px
+.btn-group > .btn-small + .dropdown-toggle
+  *padding-top: 5px
   *padding-bottom: 4px
 
-.btn-group > .btn-large.dropdown-toggle
+.btn-group > .btn-large + .dropdown-toggle
   padding-left: 12px
   padding-right: 12px
+  *padding-top: 7px
+  *padding-bottom: 7px
 
 .btn-group.open
   // The clickable button for toggling the menu
   // Remove the gradient and set the same inset shadow as the :active state
   .dropdown-toggle
     background-image: none
-    +bootstrap-box-shadow("inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)")
+    +ctb-box-shadow(#{inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05)})
   // Keep the hover's background when dropdown is open
   .btn.dropdown-toggle
     background-color: $btnBackgroundHighlight
@@ -128,30 +143,24 @@
 
 // Reposition the caret
 .btn .caret
-  margin-top: 7px
+  margin-top: 8px
   margin-left: 0
 
-.btn:hover .caret,
-.open.btn-group .caret
-  +bootstrap-opacity(100)
-
 // Carets in other button sizes
-.btn-mini .caret
-  margin-top: 5px
 
-.btn-small .caret
+.btn-mini .caret,
+.btn-small .caret,
+.btn-large .caret
   margin-top: 6px
 
 .btn-large .caret
-  margin-top: 6px
   border-left-width: 5px
   border-right-width: 5px
   border-top-width: 5px
 
 // Upside down carets for .dropup
 .dropup .btn-large .caret
-  border-bottom: 5px solid $black
-  border-top: 0
+  border-bottom-width: 5px
 
 // Account for other colors
 
@@ -164,4 +173,33 @@
   .caret
     border-top-color: $white
     border-bottom-color: $white
-    +bootstrap-opacity(75)
+
+// Vertical button groups
+// ----------------------
+
+.btn-group-vertical
+  display: inline-block
+  // makes buttons only take up the width they need
+  +ctb-ie7-inline-block
+
+.btn-group-vertical > .btn
+  display: block
+  float: none
+  max-width: 100%
+  +ctb-border-radius(0)
+
+.btn-group-vertical > .btn + .btn
+  margin-left: 0
+  margin-top: -1px
+
+.btn-group-vertical > .btn:first-child
+  +ctb-border-radius($baseBorderRadius $baseBorderRadius 0 0)
+
+.btn-group-vertical > .btn:last-child
+  +ctb-border-radius(0 0 $baseBorderRadius $baseBorderRadius)
+
+.btn-group-vertical > .btn-large:first-child
+  +ctb-border-radius($borderRadiusLarge $borderRadiusLarge 0 0)
+
+.btn-group-vertical > .btn-large:last-child
+  +ctb-border-radius(0 0 $borderRadiusLarge $borderRadiusLarge)

data/stylesheets_sass/compass_twitter_bootstrap/_buttons.sass

@@ -1,5 +1,9 @@
-// BUTTON STYLES
-// -------------
+@import compass_twitter_bootstrap/mixins
+@import compass_twitter_bootstrap/variables
+
+//
+// Buttons
+// --------------------------------------------------
 
 // Base styles
 // --------------------------------------------------
@@ -7,112 +11,106 @@
 // Core
 .btn
   display: inline-block
-  +bootstrap-ie7-inline-block
-  padding: 4px 10px 4px
+  +ctb-ie7-inline-block
+  padding: 4px 12px
   margin-bottom: 0
   // For input.btn
   font-size: $baseFontSize
   line-height: $baseLineHeight
-  *line-height: 20px
-  color: $grayDark
   text-align: center
-  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75)
   vertical-align: middle
   cursor: pointer
-  +bootstrap-buttonBackground($btnBackground, $btnBackgroundHighlight)
+  +ctb-buttonBackground($btnBackground, $btnBackgroundHighlight, $grayDark, 0 1px 1px rgba(255, 255, 255, 0.75))
   border: 1px solid $btnBorder
   *border: 0
   // Remove the border to prevent IE7's black border on input:focus
   border-bottom-color: darken($btnBorder, 10%)
-  +bootstrap-border-radius(4px)
-  +bootstrap-ie7-restore-left-whitespace
+  +ctb-border-radius($baseBorderRadius)
+  +ctb-ie7-restore-left-whitespace
   // Give IE7 some love
-  +bootstrap-box-shadow("inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)")
-
-// Hover state
-.btn:hover
-  color: $grayDark
-  text-decoration: none
-  background-color: darken($white, 10%)
-  *background-color: darken($white, 15%)
-  /* Buttons in IE7 don't get borders, so darken on hover
-  background-position: 0 -15px
-  // transition is only when going to hover, otherwise the background
-  // behind the gradient (there for IE<=9 fallback) gets mismatched
-  +bootstrap-transition(background-position 0.1s linear)
-
-// Focus state for keyboard and accessibility
-.btn:focus
-  +bootstrap-tab-focus
-
-// Active state
-
-.btn.active,
-.btn:active
-  background-color: darken($white, 10%)
-  background-color: darken($white, 15%) \9
-  background-image: none
-  outline: 0
-  +bootstrap-box-shadow("inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)")
-
-// Disabled state
-
-.btn.disabled,
-.btn[disabled]
-  cursor: default
-  background-color: darken($white, 10%)
-  background-image: none
-  +bootstrap-opacity(65)
-  +bootstrap-box-shadow(none)
+  +ctb-box-shadow(#{inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05)})
+  // Hover state
+  &:hover
+    color: $grayDark
+    text-decoration: none
+    background-position: 0 -15px
+    // transition is only when going to hover, otherwise the background
+    // behind the gradient (there for IE<=9 fallback) gets mismatched
+    +ctb-transition(background-position 0.1s linear)
+  // Focus state for keyboard and accessibility
+  &:focus
+    +ctb-tab-focus
+  // Active state
+  &.active,
+  &:active
+    background-image: none
+    outline: 0
+    +ctb-box-shadow(#{inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05)})
+  // Disabled state
+  &.disabled,
+  &[disabled]
+    cursor: default
+    background-image: none
+    +ctb-opacity(65)
+    +ctb-box-shadow(none)
 
 // Button Sizes
 // --------------------------------------------------
 
 // Large
 .btn-large
-  padding: 9px 14px
-  font-size: $baseFontSize + 2px
-  line-height: normal
-  +bootstrap-border-radius(5px)
+  padding: $paddingLarge
+  font-size: $fontSizeLarge
+  +ctb-border-radius($borderRadiusLarge)
 
-.btn-large [class^="icon-"]
-  margin-top: 1px
+.btn-large [class^="icon-"],
+.btn-large [class*=" icon-"]
+  margin-top: 4px
 
 // Small
 .btn-small
-  padding: 5px 9px
-  font-size: $baseFontSize - 2px
-  line-height: $baseLineHeight - 2px
+  padding: $paddingSmall
+  font-size: $fontSizeSmall
+  +ctb-border-radius($borderRadiusSmall)
 
-.btn-small [class^="icon-"]
+.btn-small [class^="icon-"],
+.btn-small [class*=" icon-"]
+  margin-top: 0
+
+.btn-mini [class^="icon-"],
+.btn-mini [class*=" icon-"]
   margin-top: -1px
 
 // Mini
 .btn-mini
-  padding: 2px 6px
-  font-size: $baseFontSize - 2px
-  line-height: $baseLineHeight - 4px
-
-// Alternate buttons
-// --------------------------------------------------
+  padding: $paddingMini
+  font-size: $fontSizeMini
+  +ctb-border-radius($borderRadiusSmall)
 
-// Set text color
+// Block button
 // -------------------------
 
-.btn-primary,
-.btn-primary:hover,
-.btn-warning,
-.btn-warning:hover,
-.btn-danger,
-.btn-danger:hover,
-.btn-success,
-.btn-success:hover,
-.btn-info,
-.btn-info:hover,
-.btn-inverse,
-.btn-inverse:hover
-  color: $white
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
+.btn-block
+  display: block
+  width: 100%
+  padding-left: 0
+  padding-right: 0
+  +ctb-box-sizing(border-box)
+
+// Vertically space out multiple block buttons
+.btn-block + .btn-block
+  margin-top: 5px
+
+// Specificity overrides
+
+input[type="submit"],
+input[type="reset"],
+input[type="button"]
+  &.btn-block
+    width: 100%
+
+// Alternate buttons
+// --------------------------------------------------
 
 // Provide *some* extra contrast for those who can get it
 
@@ -128,31 +126,31 @@
 // -------------------------
 .btn
   // reset here as of 2.0.3 due to Recess property order
-  border-color: #ccc
-  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25)
+  border-color: #c5c5c5
+  border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25)
 
 .btn-primary
-  +bootstrap-buttonBackground($btnPrimaryBackground, $btnPrimaryBackgroundHighlight)
+  +ctb-buttonBackground($btnPrimaryBackground, $btnPrimaryBackgroundHighlight)
 
 // Warning appears are orange
 .btn-warning
-  +bootstrap-buttonBackground($btnWarningBackground, $btnWarningBackgroundHighlight)
+  +ctb-buttonBackground($btnWarningBackground, $btnWarningBackgroundHighlight)
 
 // Danger and error appear as red
 .btn-danger
-  +bootstrap-buttonBackground($btnDangerBackground, $btnDangerBackgroundHighlight)
+  +ctb-buttonBackground($btnDangerBackground, $btnDangerBackgroundHighlight)
 
 // Success appears as green
 .btn-success
-  +bootstrap-buttonBackground($btnSuccessBackground, $btnSuccessBackgroundHighlight)
+  +ctb-buttonBackground($btnSuccessBackground, $btnSuccessBackgroundHighlight)
 
 // Info appears as a neutral blue
 .btn-info
-  +bootstrap-buttonBackground($btnInfoBackground, $btnInfoBackgroundHighlight)
+  +ctb-buttonBackground($btnInfoBackground, $btnInfoBackgroundHighlight)
 
 // Inverse appears as dark gray
 .btn-inverse
-  +bootstrap-buttonBackground($btnInverseBackground, $btnInverseBackgroundHighlight)
+  +ctb-buttonBackground($btnInverseBackground, $btnInverseBackgroundHighlight)
 
 // Cross-browser Jank
 // --------------------------------------------------
@@ -164,8 +162,8 @@ input[type="submit"].btn
     padding: 0
     border: 0
   // IE7 has some default padding on button controls
-  *padding-top: 2px
-  *padding-bottom: 2px
+  *padding-top: 3px
+  *padding-bottom: 3px
   &.btn-large
     *padding-top: 7px
     *padding-bottom: 7px
@@ -175,3 +173,30 @@ input[type="submit"].btn
   &.btn-mini
     *padding-top: 1px
     *padding-bottom: 1px
+
+// Link buttons
+// --------------------------------------------------
+
+// Make a button look and behave like a link
+
+.btn-link,
+.btn-link:active,
+.btn-link[disabled]
+  background-color: transparent
+  background-image: none
+  +ctb-box-shadow(none)
+
+.btn-link
+  border-color: transparent
+  cursor: pointer
+  color: $linkColor
+  +ctb-border-radius(0)
+
+.btn-link:hover
+  color: $linkColorHover
+  text-decoration: underline
+  background-color: transparent
+
+.btn-link[disabled]:hover
+  color: $grayDark
+  text-decoration: none