-
Notifications
You must be signed in to change notification settings - Fork 555
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
Fix padding in all screens #1547
Conversation
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.
Next time for mass copy/paste across screens it would be useful to have a checklist to tick off in the PR? Are you sure you have them all this time?
in hindsight, the copy/paste was the wrong approach anyway 😬 The padding is now being added to the div that wraps all screens, so we're good now. |
This reverts commit f279f28.
This reverts commit f279f28.
### Changes This PR fixes - Inconsistent padding across screens after #1547 ![image](https://user-images.githubusercontent.com/941075/48504661-7f7e7880-e82c-11e8-8ec9-5c5292ae1f0b.png) - IE glitches after we added flexbox in #1539 (the actual issues were: https://github.com/philipwalton/flexbugs#flexbug-3, https://github.com/philipwalton/flexbugs#flexbug-4 and https://github.com/philipwalton/flexbugs#flexbug-6) ![image](https://user-images.githubusercontent.com/941075/48504602-65dd3100-e82c-11e8-9cf0-69980328ebc2.png) # GIFs (it's not JIF) ## IE 10 ![ie10](https://user-images.githubusercontent.com/941075/48504817-cf5d3f80-e82c-11e8-9794-5608a8a5a3ca.gif) ## IE 11 ![ie11](https://user-images.githubusercontent.com/941075/48504894-fa479380-e82c-11e8-952a-0344370a433e.gif) ## Edge 17 ![edge17](https://user-images.githubusercontent.com/941075/48505076-5b6f6700-e82d-11e8-86be-969287b1cd06.gif) ## Firefox ![firefox](https://user-images.githubusercontent.com/941075/48505083-5f9b8480-e82d-11e8-900c-3ba69e6e2e12.gif) ## Safari ![safari](https://user-images.githubusercontent.com/941075/48505320-ee100600-e82d-11e8-9de2-427ea14b56fd.gif) ## Chrome ![chrome](https://user-images.githubusercontent.com/941075/48505322-ef413300-e82d-11e8-80c5-5acd333c17d6.gif) ## Pixel 2 ![pixel2](https://user-images.githubusercontent.com/941075/48505549-7393b600-e82e-11e8-8f30-0081aa36119c.gif) ## Galaxy S9 ![galaxys9](https://user-images.githubusercontent.com/941075/48505555-77273d00-e82e-11e8-8406-ec573bb5df88.gif) ## iPhone 7 ![iphone7](https://user-images.githubusercontent.com/941075/48505730-e9981d00-e82e-11e8-9dfe-963b526ead83.gif) ## iPhone X ![iphonex](https://user-images.githubusercontent.com/941075/48505736-ebfa7700-e82e-11e8-85c4-bb6fd75fbc04.gif)
Changes
When we did #1539, I had to create another div to wrap the internal content. It was copy/paster in every "screen" component, but I forgot in some of them. Instead of continue the copy/paste, I added the padding to the screen's wrapper component. This will have the same effect and it works with all screens (current and new) OOTB.
References
#1539
Testing