[Icon] fontSize prop not applied to Icon component
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 99.1k
- Forks
- 32.5k
- Avg merge
- 2d 17h
- Merged PRs (30d)
- 106
Description
- The issue is present in the latest release.
- I have searched the issues of this repository and believe that this is not a duplicate.
Current Behavior 😯
The fontSize prop does not affect the component. Using sx doesn't affect size either. Tested in Chrome 89.0 and Safari 14.0.
See example in the new docs. The fontSize prop doesn't impact the size of the icons:
https://next.material-ui.com/components/icons/#font-material-icons
Expected Behavior 🤔
Expect same behavior as in v4, displayed in the current docs:
https://next.material-ui.com/components/icons/#font-material-icons
Your Environment 🌎
`npx @material-ui/envinfo`
System: OS: macOS 10.15.7 Binaries: Node: 14.15.0 - ~/.nvm/versions/node/v14.15.0/bin/node Yarn: Not Found npm: 7.6.0 - ~/Software/plynth/Current/plynth/plynth-frontend/node_modules/.bin/npm Browsers: Chrome: 89.0.4389.128 Edge: Not Found Firefox: 81.0.1 Safari: 14.0.3 npmPackages: @emotion/react: ^11.1.5 => 11.1.5 @emotion/styled: ^11.1.5 => 11.1.5 @material-ui/core: ^5.0.0-alpha.27 => 5.0.0-alpha.27 @material-ui/icons: ^5.0.0-alpha.28 => 5.0.0-alpha.28 @material-ui/lab: ^5.0.0-alpha.27 => 5.0.0-alpha.27 @material-ui/styled-engine: 5.0.0-alpha.25 @material-ui/styles: 5.0.0-alpha.27 @material-ui/system: 5.0.0-alpha.27 @material-ui/types: 5.1.7 @material-ui/unstyled: 5.0.0-alpha.27 @material-ui/utils: 5.0.0-alpha.27 @types/react: 17.0.2 react: ^17.0.2 => 17.0.2 react-dom: ^17.0.1 => 17.0.1Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing the issue from the linked Icons documentation example with the current Icon component, then compare its fontSize and sx behavior with the v4 documentation behavior. No source file or test is named in the report; done means both props visibly control the icon size and the behavior is covered by a regression test.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100