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

[1.0.0-rc.1] On hover buttons highlight #5862

Open
MicheleLucini opened this issue Apr 26, 2018 · 3 comments
Open

[1.0.0-rc.1] On hover buttons highlight #5862

MicheleLucini opened this issue Apr 26, 2018 · 3 comments

Comments

@MicheleLucini
Copy link

MicheleLucini commented Apr 26, 2018

Materialize buttons
Codepen example

Expected Behavior

Would be nice if the lighten of .btn and .btn-large with materialize color classes would keep the lighten effect on hover. And the flat buttons would get darker.

Current Behavior

The lighten of the background color of buttons on mouse hover works only with the default color, if you choose another class color (red, blue, etc, even teal that is the default color) the effect doesn't appear anymore.

Possible Solution

Handle :hover of .btn.blue, .btn-large.blue etc to give it that lighten effect on mouse hover.

@MicheleLucini
Copy link
Author

MicheleLucini commented Apr 26, 2018

Now that I look back at it, I could just add this myself:

.btn:hover {
  filter: brightness(120%);
}

@MicheleLucini
Copy link
Author

I also noticed that flat buttons are not highlighted on hover, maybe it's intended?

.btn:hover,
.btn-large:hover {
  filter: brightness(115%);
}

.btn-flat:hover {
  background: rgba(0,0,0,0.1);
}

@MicheleLucini
Copy link
Author

This rule should be removed too

.btn:hover, .btn-large:hover, .btn-small:hover {
    background-color: #2bbbad;
}

@MicheleLucini MicheleLucini changed the title On hover materialize buttons with materialize css colors classes On hover materialize buttons with materialize css colors classes v1.0.0-beta Apr 27, 2018
@MicheleLucini MicheleLucini changed the title On hover materialize buttons with materialize css colors classes v1.0.0-beta [1.0.0-rc.1] On hover buttons highlight May 7, 2018
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

1 participant