Button mixin that sets text and text-shadow colors based on the button color. Needs Compass.

Smart Buttons

@mixin button ($color) {
	@include filter-gradient (lighten($color,7%),$color);
 	@include background-image (linear-gradient(lighten($color,7%),$color));
 	@include box-shadow (0 .1em 0 lighten($color,20%) inset);
	@include border-radius(5px);
	@include text_color ($color);
	font-size: 1em;
	padding: .7em 1em;	
	border: 1px solid darken($color,3%);
	cursor:pointer;

	&:hover {
		@include filter-gradient (lighten($color,10%),$color);
		@include background-image (linear-gradient(lighten($color,10%),$color));
	}
	
}

@mixin text_color ($color) {
	@if lightness($color) >= 60% {
		color: darken($color, 35%);
    text-shadow: 0 1px 0 lighten($color, 10%);
  
	} @else {
		color: lighten($color, 70%);
    text-shadow: 0 1px 0 darken($color, 10%);

	}
}