How to easily set a button as 'active'?

[ramontayag]

I'd like to keep a button depressed - how can you do that? For example: an on/off button

[jlong]

Fancy buttons doesn't provide something for this out of the box, but if you look at:

https://github.com/imathis/fancy-buttons/blob/master/lib/stylesheets/_fancy-buttons.sass#L37-42

You'll see the mixin calls Brandon uses to create the active state.

You could do something like this:

=depressed($color)
  +fb-color(darken($color, 6), "active", $color)
  +box-shadow(darken($color, 15) 0 .08em .2em 1px inset)

Then add another couple of lines to your styles:

&.depressed
  +depressed(blue)

Or something along those lines.

[ramontayag]

Oh cool thanks John!

Ramon Tayag

On Sat, Oct 1, 2011 at 11:56 PM, John W. Long <
[email protected]>wrote:

Fancy buttons doesn't provide something for this out of the box, but if you
look at:

https://github.com/imathis/fancy-buttons/blob/master/lib/stylesheets/_fancy-buttons.sass#L37-42

You'll see the mixin calls Brandon uses to create the active state.

You could do something like this:

=depressed($color)
+fb-color(darken($color, 6), "active", $color)
+box-shadow(darken($color, 15) 0 .08em .2em 1px inset)

Then add another couple of lines to your styles:

&.depressed
+depressed(blue)

Or something along those lines.

Reply to this email directly or view it on GitHub:
#31 (comment)