In landscape the status bar (container) gets a grey background.

[alucardu]

Bug Report

Problem

In my Angular app I use Capacitor and this plugin to rotate the orientation to landscape while playing a video with the Angular YouTube player. When the view is rotated the status bar moves to the top of the page as expected, but (now on the left of the device) where the status bar used to be the background color has changed to grey.

Enjoy this artists rendition:

What is expected to happen?

The "container" of the status bar shouldn't change background color

What does actually happen?

The "container" of the status bar changes change background color

Environment, Platform, Device

I'm viewing the app on my Pixel 5 device which is connected through Android Studio.
You should be able to checkout this repo and reproduce the issue: https://github.com/alucardu/angular-movieseat (mind that if I run this on a virtual Pixel 5 device the issue doesn't show, only when using a real device).

Version information

    "@capacitor/android": "^4.7.3",
    "@capacitor/angular": "2.0.3",
    "@capacitor/app": "^4.1.1",
    "@capacitor/core": "latest",
    "@capacitor/ios": "^4.7.3",
    "@capacitor/status-bar": "^4.1.1",
    "cordova-plugin-screen-orientation": "^3.0.3",

Checklist

• I searched for existing GitHub issues
• I updated all Cordova tooling to most recent version
• I included all the necessary information above