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

[IconButton] Add support for density #14871

Closed
2 tasks done
charlax opened this issue Mar 13, 2019 · 2 comments
Closed
2 tasks done

[IconButton] Add support for density #14871

charlax opened this issue Mar 13, 2019 · 2 comments
Labels
component: icon button This is the name of the generic UI component, not the React module! new feature New feature or request

Comments

@charlax
Copy link
Contributor

charlax commented Mar 13, 2019

  • This is not a v0.x issue.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior 🤔

The Material spec allows for denser spacing (10px instead of 12px) for IconButton on desktop:

When a mouse and keyboard are the primary input methods, measurements may be condensed to accommodate denser layouts. Dense icons of 20dp can use a touch target of 40dp.

As to whether a dense property should be used or padding, margin, spacing or size, there is some discussion in #14561. padding is pretty explicit (and allows padding="none" but then consistency with the other use of this property is probably more important.

Current Behavior 😯

No such option. Had to manually provide padding: 10.

Context 🔦

Similar issues: #14521

@charlax charlax changed the title [IconButton] Add dense property [IconButton] Add support for density Mar 13, 2019
@oliviertassinari
Copy link
Member

oliviertassinari commented Mar 13, 2019

@charlax Thanks for the issue. It's fixed in #14649. You have a demo in: https://next.material-ui.com/demos/buttons/#sizes.

@oliviertassinari oliviertassinari added new feature New feature or request component: icon button This is the name of the generic UI component, not the React module! labels Mar 13, 2019
@charlax
Copy link
Contributor Author

charlax commented Mar 13, 2019

@oliviertassinari too fast! Amazing job. Thanks a lot!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: icon button This is the name of the generic UI component, not the React module! new feature New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants