Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to easily set a button as 'active'? #31

Open
ramontayag opened this issue Oct 1, 2011 · 2 comments
Open

How to easily set a button as 'active'? #31

ramontayag opened this issue Oct 1, 2011 · 2 comments

Comments

@ramontayag
Copy link

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

@jlong
Copy link
Collaborator

jlong commented Oct 1, 2011

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
Copy link
Author

Oh cool thanks John!

Ramon Tayag

On Sat, Oct 1, 2011 at 11:56 PM, John W. Long <
reply@reply.github.com>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)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants