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

[Paper] Reduce the default elevation #15243

Merged
merged 4 commits into from Apr 10, 2019

Conversation

oliviertassinari
Copy link
Member

@oliviertassinari oliviertassinari commented Apr 7, 2019

This is a proposal. Google seems to use fewer and fewer elevation with its product design. I think that we can reflect this trend by decreasing the default elevation of the Paper from 2 to 1. Please review!

Breaking change

Change the default Paper elevation to match the Card and the Expansion Panel:

-<Paper />
+<Paper elevation={2} />

@oliviertassinari oliviertassinari added breaking change component: Paper This is the name of the generic UI component, not the React module! labels Apr 7, 2019
@mui-pr-bot
Copy link

mui-pr-bot commented Apr 7, 2019

Details of bundle changes.

Comparing: 1fa8f94...30b70e1

bundle parsed diff gzip diff prev parsed current parsed prev gzip current gzip
@material-ui/core -0.00% -0.01% 347,568 347,556 89,893 89,888
@material-ui/core/Paper 0.00% 0.00% 68,404 68,404 20,053 20,053
@material-ui/core/Paper.esm 0.00% 0.00% 60,735 60,735 18,785 18,785
@material-ui/core/Popper 0.00% 0.00% 34,930 34,930 11,917 11,917
@material-ui/core/styles/createMuiTheme 0.00% 0.00% 17,877 17,877 5,962 5,962
@material-ui/core/useMediaQuery 0.00% 0.00% 2,463 2,463 1,044 1,044
@material-ui/lab 0.00% 0.00% 148,119 148,119 43,913 43,913
@material-ui/styles 0.00% 0.00% 53,143 53,143 15,443 15,443
@material-ui/system 0.00% 0.00% 17,132 17,132 4,519 4,519
Button 0.00% 0.00% 88,669 88,669 26,423 26,423
Modal 0.00% 0.00% 82,688 82,688 24,802 24,802
colorManipulator 0.00% 0.00% 3,745 3,745 1,537 1,537
docs.landing 0.00% 0.00% 49,820 49,820 10,807 10,807
docs.main 0.00% 0.00% 644,630 644,630 200,877 200,877
packages/material-ui/build/umd/material-ui.production.min.js -0.00% -0.01% 296,257 296,245 82,811 82,806

Generated by 🚫 dangerJS against 30b70e1

@eps1lon
Copy link
Member

eps1lon commented Apr 7, 2019

I'd be careful with these changes since they're already easily customizable. Elevation is also a relative to one another so I'm not sure about all the cascading effects this change might have.

That being said standard sheets in the spec actually only have 0 resting elevation. Cards have 1.

Since Paper is an ambiguous term I would rather keep this default value.

@oliviertassinari
Copy link
Member Author

@eps1lon I like the idea of the Card and the Paper having the same default elevation:

Elevation 2 (Paper)
Capture d’écran 2019-04-08 à 12 58 23

Elevation 1 (Card)
Capture d’écran 2019-04-08 à 12 56 11

In the future, I think that it would be great to have a way to get an outlined Paper:

Google Keep
Capture d’écran 2019-04-08 à 12 52 32

pages/api/paper.md Outdated Show resolved Hide resolved
@oliviertassinari
Copy link
Member Author

oliviertassinari commented Apr 10, 2019

@eps1lon I understand your concern. I think that we should move forward. The motivation is to reduce the default shadows. I think that we should discourage the usage of too many elevations. It works best on mobile than on desktop. After this change, the Card, the Paper and the Expansion panel use the same default value. That's better. It's also closer to chrome://settings/.

@eps1lon eps1lon merged commit 468bbd5 into mui:next Apr 10, 2019
@eps1lon eps1lon mentioned this pull request Apr 19, 2019
56 tasks
@oliviertassinari oliviertassinari deleted the paper-elevation-1 branch May 16, 2019 15:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
breaking change component: Paper This is the name of the generic UI component, not the React module!
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants