lib/stylesheets/_fancy-buttons.sass in fancy-buttons-1.0.3 vs lib/stylesheets/_fancy-buttons.sass in fancy-buttons-1.0.4
- old
+ new
@@ -17,11 +17,10 @@
$fb-dark-text: #222222 !default
$fb-gradient: 1 !default
$fb-image-path: image-url("button_bg.png") !default
$fb-allow-disabled: false !default
$fb-line-height: 1.2em !default
-$fb-inset: true !default
// Make a fancy button.
=fancy-button($color: $fb-color, $font-size: $fb-font-size, $radius: $fb-radius, $border-width: $fb-border-width)
+fancy-button-structure($font-size, $radius, $border-width)
+fancy-button-colors($color)
@@ -35,19 +34,19 @@
@else
+fb-color($hover, "hover")
&:active
@if $active == 0
+fb-color(darken($color, 6), "active", $color)
+ +box-shadow(darken($color, 15), 0, .08em, .1em, 1px, inset)
@else
+fb-color($active, "active")
- @if $fb-inset
- +box-shadow(darken($color, 15), 0, .08em, .1em, 1px, inset)
+ +box-shadow(darken($active, 9), 0, .08em, .1em, 1px, inset)
+
@if $allow-disabled
&.disabled, &[disabled]
+disable-fancy-button($color)
- @if $fb-inset
- +box-shadow(rgba(255,255,255, (lightness($color))/100), 0, 0, .1em, 1px, inset)
+ +box-shadow(rgba(255,255,255, (lightness($color))/100), 0, 0, .1em, 1px, inset)
+background-clip(padding-box)
=fancy-button-allow-disable($color: $fb-color, $font-size: $fb-font-size, $radius: $fb-radius, $border-width: $fb-border-width)
$fb-disable-allowed: $fb-allow-disable
$fb-allow-disable: true
@@ -91,21 +90,21 @@
// Apply the button colors specified for the button state into which it is mixed.
=fb-state-colors($color, $gradient-top, $gradient-bottom, $border, $state, $lumins: $color)
background-color: $color
@if $fb-gradient != 0
@if $fb-gradient-style == "glossy"
- @if $fb-invert-on-click != 0 and $state == "active"
- +invert-fancy-gradient($gradient-top, $gradient-bottom)
+ @if $state == "active"
+ +fancy-gradient-active($gradient-top, $gradient-bottom)
@else
+fancy-gradient($gradient-top, $gradient-bottom)
@else if $fb-gradient-style == "matte"
- @if $fb-invert-on-click and $state == "active"
- +invert-fancy-matte-gradient($gradient-top, $gradient-bottom)
+ @if $state == "active"
+ +fancy-matte-gradient-active($gradient-top, $gradient-bottom)
@else
+fancy-matte-gradient($gradient-top, $gradient-bottom)
@else if $fb-gradient-style == "custom"
- @if $fb-invert-on-click and $state == "active"
- +invert-custom-fancy-gradient($gradient-top, $gradient-bottom)
+ @if $state == "active"
+ +custom-fancy-gradient-active($gradient-top, $gradient-bottom)
@else
+custom-fancy-gradient($gradient-top, $gradient-bottom)
border:
color: $border
$text-shadow-settings: unquote("0px 1px 1px")
\ No newline at end of file