cordova-plugin-meteor-webapp icon indicating copy to clipboard operation
cordova-plugin-meteor-webapp copied to clipboard

Support for new iOS11 safe-area-inset-* CSS rule.

Open bmanturner opened this issue 8 years ago • 1 comments

In order to design around the iPhoneX 'notch', Apple provides some styling variables (safe-area-inset-*) to help set padding. In meteor's ios webview these values always evaluate to 0. The workaround is to use a cordova plugin to determine if the device is an iPhoneX and then add a class to the <body> and provide the padding manually. I've only tested this on the sim, so I may be mistaken about this problem existing on an actual device.

Thanks.

bmanturner avatar Oct 29 '17 17:10 bmanturner

@bmanturner Stumbled over the same issue. I'm not a Meteor dev but just tried this on latest PhoneGap version with iOS 11.3 simulator set to iPhoneX. Indeed all values for safe-area-inset-* always seem to be 0 :-( Do you know if this is a known issue at Apple and maybe have a link for more info? Also, which is the Cordova plugin you mentioned?

Thanks!

valnub avatar May 21 '18 12:05 valnub