Contents

@import 'facades/utilities';

@mixin button-base($radius: $button-border-radius){
	@include inline-block;
	text-align:center;
	@if $radius not false and $radius not none{
		-webkit-border-radius:$radius;
		-moz-border-radius:$radius;
		border-radius:$radius;
	}
}

@mixin simple-button($bg-color, $text-color:white, $radius: $button-border-radius){
	@include button-base;	
	color:$text-color;
	background-color:$bg-color;
	border-top:1px solid lighten($bg-color, 4%);
	border-bottom:1px solid darken($bg-color, 4%);
	&:hover{ background-color:lighten($color, 3%); }
	&:active{ background-color:darken($color, 3%); @include box-shadow(darken($color, 7%) 0px 0px 3px 3px inset); }
}

@mixin gradient-button($start-color, $end-color:darken($start-color, 5%), $text-color:white, $radius: $button-border-radius){
	@include button-base;
	color:$text-color;
	@include background-image(linear-gradient($start-color 10%, $end-color 90%));
	border-top:1px solid lighten($start-color, 4%);
	border-bottom:1px solid darken($end-color, 4%);
	
	&:hover{ @include background-image(linear-gradient(lighten($start-color, 3%) 10%, lighten($end-color, 3%) 90%)); }
	&:active{ @include background-image(linear-gradient(darken($start-color, 3%) 10%, lighten($end-color, 3%) 90%)); 
		@include box-shadow(darken($start-color, 7%) 0px 0px 3px 3px inset);
	}
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
facades-0.1.0	lib/facades/stylesheets/facades/ui/_buttons.scss
facades-0.0.7	lib/facades/stylesheets/facades/ui/_buttons.scss