Does Framework 7 correctly position the navbar text/label for iPhone X layout?
My iOS style guides indicate it should be about 57px from the top, but the F7 navbar sits about 32px from the top (the same as default layout for iPhone 6/7/8).
Is there a class to add to give extra padding/positioning to an iPhone X navbar?
Can you show the screenshot of what you have?
iPhone 6/7/8 (within Chrome dev tools):
iPhone X (within Chrome dev tools):
Chrome devtools won’t be able to emulate it correctly. But anyway, the navbar layout should be the same. Difference is statusbar-overlay, which is larger on iphone-x which, so the navbar will be lower, but you won’t see it in chrome dev tools
Thank you, you are correct.
iPhone 8 simulator:
iPhone X simulator:
What is the new height of the iPhone X statusbar-overlay element? Knowing this value will help me to specify top pixel values for position:absolute elements. I’ve previously been working with 20px for other iPhone models.