div qr-shaded-region not showing certain screen width

[husencoolwolf]

Describe the bug The shade of qr on div tag with id "qr-shaded-region". not showing when in certain size (in my case on 820px width of screen). it disterupt me cause i had event that waiting that spesific div region too. and else it also make qr region not able to see.

To Reproduce Steps to reproduce the behavior:

1. open your project
2. inspect page
3. set width to 820px
4. reload page
5. shade is not appearing

Expected behavior Shade of qr area it has to be there to spesify scan area

Screenshots

Desktop (please complete the following information):

• OS: Windows 10
• Browser chrome
• Version 111.0.5563.65 (Official Build) (64-bit)

Additional context You can check my vid also : Bug Video

[MarcelJurtz]

Can confirm this, I have the same issue. It doesn't seem to be affected by the screen size directly, but for me it's occurring on iPhone 11 (Safari) and Android (Galaxy S10, Chrome) as well as on the mobile emulator in Chrome on Desktop (Windows).

[HRasch]

To solve this issue: CSS on the container-element

#camera-container video {
  height: 100%;
  object-fit: contain;
}