compass_twitter_bootstrap 2.0.1.2 → 2.0.3

data/stylesheets_sass/compass_twitter_bootstrap/_buttons.sass

@@ -7,60 +7,63 @@
 // Core
 .btn
   display: inline-block
+  +bootstrap-ie7-inline-block
   padding: 4px 10px 4px
   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
-  +buttonBackground($white, darken($white, 10%))
-  border: 1px solid #ccc
-  border-bottom-color: #bbb
-  +border-radius(4px)
-  $shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05)
-  +box-shadow($shadow)
   cursor: pointer
+  +bootstrap-buttonBackground($btnBackground, $btnBackgroundHighlight)
+  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
   // Give IE7 some love
-  +reset-filter
-  +ie7-restore-left-whitespace
+  +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
-  +transition(background-position 0.1s linear)
+  +bootstrap-transition(background-position 0.1s linear)
 
 // Focus state for keyboard and accessibility
 .btn:focus
-  +tab-focus
+  +bootstrap-tab-focus
 
 // Active state
 
 .btn.active,
 .btn:active
-  background-image: none
-  $shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05)
-  +box-shadow($shadow)
   background-color: darken($white, 10%)
-  background-color: darken($white, 15%) e("\9")
+  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-image: none
   background-color: darken($white, 10%)
-  +opacity(0.65)
-  +box-shadow(none)
+  background-image: none
+  +bootstrap-opacity(65)
+  +bootstrap-box-shadow(none)
 
 // Button Sizes
 // --------------------------------------------------
@@ -70,7 +73,7 @@
   padding: 9px 14px
   font-size: $baseFontSize + 2px
   line-height: normal
-  +border-radius(5px)
+  +bootstrap-border-radius(5px)
 
 .btn-large [class^="icon-"]
   margin-top: 1px
@@ -108,8 +111,8 @@
 .btn-info:hover,
 .btn-inverse,
 .btn-inverse:hover
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
   color: $white
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
 
 // Provide *some* extra contrast for those who can get it
 
@@ -118,33 +121,38 @@
 .btn-danger.active,
 .btn-success.active,
 .btn-info.active,
-.btn-dark.active
+.btn-inverse.active
   color: rgba(255, 255, 255, 0.75)
 
 // Set the backgrounds
 // -------------------------
+.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)
+
 .btn-primary
-  +buttonBackground($primaryButtonBackground, adjust-hue($primaryButtonBackground, 20))
+  +bootstrap-buttonBackground($btnPrimaryBackground, $btnPrimaryBackgroundHighlight)
 
 // Warning appears are orange
 .btn-warning
-  +buttonBackground(lighten($orange, 15%), $orange)
+  +bootstrap-buttonBackground($btnWarningBackground, $btnWarningBackgroundHighlight)
 
 // Danger and error appear as red
 .btn-danger
-  +buttonBackground(#ee5f5b, #bd362f)
+  +bootstrap-buttonBackground($btnDangerBackground, $btnDangerBackgroundHighlight)
 
 // Success appears as green
 .btn-success
-  +buttonBackground(#62c462, #51a351)
+  +bootstrap-buttonBackground($btnSuccessBackground, $btnSuccessBackgroundHighlight)
 
 // Info appears as a neutral blue
 .btn-info
-  +buttonBackground(#5bc0de, #2f96b4)
+  +bootstrap-buttonBackground($btnInfoBackground, $btnInfoBackgroundHighlight)
 
 // Inverse appears as dark gray
 .btn-inverse
-  +buttonBackground(#454545, #262626)
+  +bootstrap-buttonBackground($btnInverseBackground, $btnInverseBackgroundHighlight)
 
 // Cross-browser Jank
 // --------------------------------------------------
@@ -158,9 +166,12 @@ input[type="submit"].btn
   // IE7 has some default padding on button controls
   *padding-top: 2px
   *padding-bottom: 2px
-  &.large
+  &.btn-large
     *padding-top: 7px
     *padding-bottom: 7px
-  &.small
+  &.btn-small
     *padding-top: 3px
     *padding-bottom: 3px
+  &.btn-mini
+    *padding-top: 1px
+    *padding-bottom: 1px

data/stylesheets_sass/compass_twitter_bootstrap/_carousel.sass

@@ -15,7 +15,7 @@
   .item
     display: none
     position: relative
-    +transition(0.6s ease-in-out left)
+    +bootstrap-transition(0.6s ease-in-out left)
   // Account for jankitude on images
   .item > img
     display: block
@@ -60,14 +60,14 @@
   text-align: center
   background: $grayDarker
   border: 3px solid $white
-  +border-radius(23px)
-  +opacity(0.5)
+  +bootstrap-border-radius(23px)
+  +bootstrap-opacity(50)
   // we can't have this transition here
   // because webkit cancels the carousel
   // animation if you trip this while
   // in the middle of another animation
   // ;_;
-  // @include transition(opacity .2s linear);
+  // @include bootstrap-transition(opacity .2s linear);
   // Reposition the right one
   &.right
     left: auto
@@ -76,7 +76,7 @@
   &:hover
     color: $white
     text-decoration: none
-    +opacity(0.9)
+    +bootstrap-opacity(90)
 
 // Caption for text below images
 // -----------------------------

data/stylesheets_sass/compass_twitter_bootstrap/_close.sass

@@ -8,9 +8,19 @@
   line-height: $baseLineHeight
   color: $black
   text-shadow: 0 1px 0 rgba(255, 255, 255, 1)
-  +opacity(0.2)
+  +bootstrap-opacity(20)
   &:hover
     color: $black
     text-decoration: none
-    +opacity(0.4)
     cursor: pointer
+    +bootstrap-opacity(40)
+
+// Additional properties for button version
+// iOS requires the button element instead of an anchor tag.
+// If you want the anchor version, it requires `href="#"`.
+button.close
+  padding: 0
+  cursor: pointer
+  background: transparent
+  border: 0
+  -webkit-appearance: none

data/stylesheets_sass/compass_twitter_bootstrap/_code.sass

@@ -7,14 +7,14 @@
 code,
 pre
   padding: 0 3px 2px
-  +font-family-monospace
+  +bootstrap-font-family-monospace
   font-size: $baseFontSize - 1
   color: $grayDark
-  +border-radius(3px)
+  +bootstrap-border-radius(3px)
 
 // Inline code
 code
-  padding: 3px 4px
+  padding: 2px 4px
   color: #d14
   background-color: #f7f7f9
   border: 1px solid #e1e1e8
@@ -24,17 +24,18 @@ pre
   display: block
   padding: ($baseLineHeight - 1) / 2
   margin: 0 0 $baseLineHeight / 2
-  font-size: 12px
+  font-size: $baseFontSize * 0.925
+  // 13px to 12px
   line-height: $baseLineHeight
+  word-break: break-all
+  word-wrap: break-word
+  white-space: pre
+  white-space: pre-wrap
   background-color: #f5f5f5
   border: 1px solid #ccc
   // fallback for IE7-8
   border: 1px solid rgba(0, 0, 0, 0.15)
-  +border-radius(4px)
-  white-space: pre
-  white-space: pre-wrap
-  word-break: break-all
-  word-wrap: break-word
+  +bootstrap-border-radius(4px)
   // Make prettyprint styles more spaced out for readability
   &.prettyprint
     margin-bottom: $baseLineHeight

data/stylesheets_sass/compass_twitter_bootstrap/_component-animations.sass

@@ -2,15 +2,15 @@
 // --------------------
 
 .fade
-  +transition(opacity 0.15s linear)
-  opacity: 0
+  +bootstrap-opacity(0)
+  +bootstrap-transition(opacity 0.15s linear)
   &.in
-    opacity: 1
+    +bootstrap-opacity(100)
 
 .collapse
-  +transition(height 0.35s ease)
   position: relative
-  overflow: hidden
   height: 0
+  overflow: hidden
+  +bootstrap-transition(height 0.35s ease)
   &.in
     height: auto

data/stylesheets_sass/compass_twitter_bootstrap/_dropdowns.sass

@@ -2,6 +2,8 @@
 // --------------
 
 // Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
+
+.dropup,
 .dropdown
   position: relative
 
@@ -14,74 +16,59 @@
   outline: 0
 
 // Dropdown arrow/caret
+// --------------------
 .caret
   display: inline-block
   width: 0
   height: 0
-  text-indent: -99999px
-  // IE7 won't do the border trick if there's a text indent, but it doesn't
-  // do the content that text-indent is hiding, either, so we're ok.
-  *text-indent: 0
   vertical-align: top
-  border-left: 4px solid transparent
-  border-right: 4px solid transparent
   border-top: 4px solid $black
-  +opacity(0.3)
-  content: "\2193"
+  border-right: 4px solid transparent
+  border-left: 4px solid transparent
+  content: ""
+  +bootstrap-opacity(30)
 
+// Place the caret
 .dropdown .caret
   margin-top: 8px
   margin-left: 2px
 
 .dropdown:hover .caret,
-.open.dropdown .caret
-  +opacity(1)
+.open .caret
+  +bootstrap-opacity(100)
 
 // The dropdown menu (ul)
+// ----------------------
 .dropdown-menu
   position: absolute
   top: 100%
   left: 0
   z-index: $zindexDropdown
-  float: left
   display: none
   // none by default, but block on "open" of the menu
+  float: left
   min-width: 160px
-  _width: 160px
   padding: 4px 0
-  margin: 0
+  margin: 1px 0 0
   // override default ul
   list-style: none
-  background-color: $white
-  border-color: #ccc
-  border-color: rgba(0, 0, 0, 0.2)
-  border-style: solid
-  border-width: 1px
-  +border-radius(0 0 5px 5px)
-  +box-shadow(0 5px 10px rgba(0, 0, 0, 0.2))
+  background-color: $dropdownBackground
+  border: 1px solid #ccc
+  border: 1px solid rgba(0, 0, 0, 0.2)
+  *border-right-width: 2px
+  *border-bottom-width: 2px
+  +bootstrap-border-radius(5px)
+  +bootstrap-box-shadow(0 5px 10px rgba(0, 0, 0, 0.2))
   -webkit-background-clip: padding-box
   -moz-background-clip: padding
   background-clip: padding-box
-  *border-right-width: 2px
-  *border-bottom-width: 2px
-  // Allow for dropdowns to go bottom up (aka, dropup-menu)
-  &.bottom-up
-    top: auto
-    bottom: 100%
-    margin-bottom: 2px
+  // Aligns the dropdown menu to right
+  &.pull-right
+    right: 0
+    left: auto
   // Dividers (basically an hr) within the dropdown
   .divider
-    height: 1px
-    margin: 5px 1px
-    overflow: hidden
-    background-color: #e5e5e5
-    border-bottom: 1px solid $white
-    // IE7 needs a set width since we gave a height. Restricting just
-    // to IE7 to keep the 1px left/right space in other browsers.
-    // It is unclear where IE is getting the extra space that we need
-    // to negative-margin away, but so it goes.
-    *width: 100%
-    *margin: -5px 0 5px
+    +bootstrap-nav-divider
   // Links within the dropdown menu
   a
     display: block
@@ -89,32 +76,55 @@
     clear: both
     font-weight: normal
     line-height: $baseLineHeight
-    color: $gray
+    color: $dropdownLinkColor
     white-space: nowrap
 
 // Hover state
+// -----------
 
 .dropdown-menu li > a:hover,
 .dropdown-menu .active > a,
 .dropdown-menu .active > a:hover
-  color: $white
+  color: $dropdownLinkColorHover
   text-decoration: none
-  background-color: $linkColor
+  background-color: $dropdownLinkBackgroundHover
 
 // Open state for the dropdown
-.dropdown.open
+// ---------------------------
+.open
   // IE7's z-index only goes to the nearest positioned ancestor, which would
   // make the menu appear below buttons that appeared later on the page
   *z-index: $zindexDropdown
-  .dropdown-toggle
-    color: $white
-    background: #ccc
-    background: rgba(0, 0, 0, 0.3)
   .dropdown-menu
     display: block
 
+// Right aligned dropdowns
+// ---------------------------
+.pull-right .dropdown-menu
+  right: 0
+  left: auto
+
+// Allow for dropdowns to go bottom up (aka, dropup-menu)
+// ------------------------------------------------------
+// Just add .dropup after the standard .dropdown class and you're set, bro.
+// TODO: abstract this so that the navbar fixed styles are not placed here?
+
+.dropup,
+.navbar-fixed-bottom .dropdown
+  // Reverse the caret
+  .caret
+    border-top: 0
+    border-bottom: 4px solid $black
+    content: "\2191"
+  // Different positioning for bottom up menu
+  .dropdown-menu
+    top: auto
+    bottom: 100%
+    margin-bottom: 1px
+
 // Typeahead
+// ---------
 .typeahead
   margin-top: 2px
   // give it some space to breathe
-  +border-radius(4px)
+  +bootstrap-border-radius(4px)