'Colour around iPhone Notch in Cordova/Phonegap app

I have developed a iPhone app using Cordova however I end up with a white area around the iPhone Notch that would like to fill blue to match the top menu.

enter image description here

I would have thought this would be easy but so far I have not found a nice solution.

I know that I could set viewport-fit=cover But this would mean my menubar etc would go behind the iPhone status icons etc

cordovaphonegap


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions

How to trigger cordova's backbutton event programatically

Using a QRCode scanner in an inappbrowser with cordova and MVC

How can I display an Iframe in an iOS app

Phonegap Android permissions, config.xml and plugins

Firebase Project Results in "Auth/network-request-failed" error on login

Failed to load resource: Preflight response is not successful

Got error when deploy adapter in mfpdev

How to add basic UI components in cordova project?

Plugin should use a background thread ( Terminating app due to uncaught exception 'NSInvalidArgumentException' )

HTML5 datalist tag is not working in android

Gradle error : Server returned HTTP response code: 403 for URL: http://services.gradle.org/distributions/gradle-2.2.1-all.zip

Cordova (android) : Avoid the grey background before splash screen

Cordova build changes distributionUrl in gradle-wrapper.properties file

how to add to settings.gradle in cordova

Cordova console.log not working