-
Notifications
You must be signed in to change notification settings - Fork 4.1k
Description
What's the issue?
Our banner that is fixed to the bottom of the screen (position:fixed, bottom: 0px) is sometimes rendered fully or halfway out of the viewport. Both issues can be "fixed" by scrolling to the bottom of the page and swiping down, as if you were doing a pull-to-refresh motion on the bottom of the screen.
Here are a few videos that demonstrate the issue to help in case you are unable to reproduce:
- Banner rendering partially out of the viewport
- Banner rendering fully out of the viewport
- Swiping through AMP pages that all have partially obstructed banner
How do we reproduce the issue?
This issue is most easily reproducible on an actual phone, rather than by emulating a device in Chrome dev tools.
- Make sure you are logged out of Pinterest by going to www.pinterest.com/logout
- Visit https://www.google.com/amp/s/www.pinterest.com/amp/pin/27866091429714425/ to see halfway out example
- Visit https://www.google.com/amp/s/www.pinterest.com/amp/pin/5840674496841567/ to see fully out example
Expected result: Black banner at the bottom is fully visible
Actual result: Black banner is halfway or fully hidden and obstructed by the view port
What browsers are affected?
Chrome v67.0.3396.87 and Firefox v12.1 (10941) are affected. Safari does not appear to be. Have not tried other versions of Chrome/Firefox.
Reproducible on iPhone X and iPhone 6s. Have not tried other devices.
Which AMP version is affected?
Unable to tell at this time, since I can only repro on a phone.