Sha256: 84f5f9ba7cd21e84d12e73e1d66cbda9fba324f03cbe215da2eeb5d5c36e02c2
Contents?: true
Size: 1.46 KB
Versions: 17
Compression:
Stored size: 1.46 KB
Contents
=simple-button($color: blue)
transition: .5s (background-image)
background-color: $color
color: luma_contrast_color($color)
font-weight: bold
transition: all .2s ease-out
&:hover,
&.hover
$color: darken($color, 9%)
@if luma($color) > 90
background-color: #f2f2f2
@else
background-color: $color
&:active,
&.active
$color: darken($color, 12%)
@if luma($color) > 90
background-color: #f2f2f2
@else
background-color: $color
+top(1px)
// radio & checkbos
&.is-radio,
&.is-checkbox
&:before
box-shadow: rgba(black, 0.2) 0 1px 1px inset
background-color: #{if(luma_bright($color), shade($color, 20%), tint($color, 20%))}
// checked
&.is-checked
color: luma_contrast_color($button-checked-color)
background-color: $button-checked-color
+top(1px)
&:before
box-shadow: rgba(black, 0.3) 0 1px 1px inset
background-color: #{if(luma_bright($button-checked-color), shade($button-checked-color, 40%), tint($button-checked-color, 40%))}
// select
&.is-select
&:after
color: rgba(luma_contrast_color($color), .7)
border-left: 1px solid
border-left-color: #{if(luma_bright($color), shade($color, 20%), tint($color, 20%))}
// disabled
&.is-disabled,
&:disabled
$color: if(luma_bright($color), desaturate(shade($color, 30%), 30%), desaturate(tint($color, 30%), 30%))
background-color: rgba($color, 9)
color: rgba(luma_contrast_color($color), .7)
Version data entries
17 entries across 17 versions & 1 rubygems