_buttons.sass in sass-rails-bootstrap-2.0.3a

- old
+ new

@@ -8,32 +8,34 @@
 // Core
 .btn
   display: inline-block
   +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,.75)
+  vertical-align: middle
+  cursor: pointer
   +button-background($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%)
   +border-radius(4px)
+  +ie7-restore-left-whitespace  // Give IE7 some love
   $shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)
   +box-shadow($shadow)
-  cursor: pointer
-  
-  // Give IE7 some love
-  +reset-filter
-  +ie7-restore-left-whitespace
 
 // 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 .1s linear)
 
@@ -42,23 +44,23 @@
   +tab-focus
 
 // Active state
 .btn.active,
 .btn:active
-  background-image: none
-  $shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)
-  +box-shadow($shadow)
   background-color: darken($white, 10%)
   background-color: darken($white, 15%) #{"\9"}
+  background-image: none
   outline: 0
+  $shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)
+  +box-shadow($shadow)
   
 // Disabled state
 .btn.disabled,
 .btn[disabled]
   cursor: default
-  background-image: none
   background-color: darken($white, 10%)
+  background-image: none
   +opacity(65)
   +box-shadow(none)
 
 // Button sizes
 // --------------------------------------------------
@@ -102,12 +104,12 @@
 .btn-success:hover,
 .btn-info,
 .btn-info:hover,
 .btn-inverse,
 .btn-inverse:hover
-  text-shadow: 0 -1px 0 rgba(0,0,0,.25)
   color: $white
+  text-shadow: 0 -1px 0 rgba(0,0,0,.25)
     
 // Provide *some* extra contrast for those who can get it
 .btn-primary.active,
 .btn-warning.active,
 .btn-danger.active,
@@ -116,9 +118,13 @@
 .btn-inverse.active
   color: rgba(255,255,255,.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,.1) rgba(0,0,0,.1) rgba(0,0,0,.25)
 .btn-primary
   +button-background($btnPrimaryBackground, $btnPrimaryBackgroundHighlight)
 // Warning appears as orange
 .btn-warning
   +button-background($btnWarningBackground, $btnWarningBackgroundHighlight)