-
Notifications
You must be signed in to change notification settings - Fork 6.8k
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
feat(button): add md-icon-button styling. #206
Conversation
height: 40px; | ||
|
||
line-height: 24px; | ||
border-radius: 50%; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I see that the material1 icon-button is the same, but I'm curious: why does it use border-radius: 50%
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Because if you have a 24x24 square, then 50% of all sides will be used to archive a responsive perfect circle.
So it's needed to make the element round, like in polymer-icon-button and Material 1
cc @kara |
min-width: 0; | ||
padding: 0; | ||
|
||
width: 40px; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Would you mind putting this in a Sass variable? All other button sizes are variables in _button_base.scss, so dense layouts can adjust as necessary.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, done 👍
2a23a6e
to
e4ea5e9
Compare
* Added md-icon-button component * Showcased the md-icon-button in the button demos. Fixes angular#188
e4ea5e9
to
a7cbd16
Compare
LGTM |
I wonder why this isn't included in the documentation examples :( |
@willshowell awesome! thanks |
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
I noticed that the icon-button is like a clone of a min-fab, maybe we can make the fab mixin more generic, to let it use by the icon-button too.
Fixes #188