Mobile Keyboard covers interface, and does not allow the user to scroll

[bitmage (Brandon Mason)]

Android keyboard overlaps text when flagging with Something else

The screenshot says it all - you can’t see what you are typing. Latest Android Chrome, and the screenshot is taken here at Meta. [Screenshot_20221222_203433_Chrome]

This is still quite broken, and impacting my users on signup, login, and when creating/editing posts. I have watched this happen on both phones and tablets. I think at least one of the tablets was an iOS device, but I mostly observe this on Android.

My forum is geographically local, so I often get to observe people interacting with it in person.

I’m open to a CSS fix for now, and it would probably be good for a fix to make its way into core. I’ll update here if I find a solution.

[Heliosurge (Dan DeMontmorency)]

Did you try Don:s CSS fix?

@Don

I can confirm This is actually happens on all modal where the keyboard show up. I made a quick fix while the fix is coming.

Mobile / CSS

.fixed-modal {
  html.keyboard-visible.mobile-device:not(.ios-device) & {
    height: calc(100% - env(keyboard-inset-height));
    .modal-inner-container {
      margin: auto;
    }
  }
}

Edit: I just noticed now on iPad the html tag not contains the .ios-device class and this code is activating on iPad mobile view too. So probable a good idea to restrict it to mobile devices. I’ve changed this code.