Как подстроить экран под клавиатуру на PWA?

Question

[Александр Петров]

Делаю мессенджер. Есть проблема.
Когда на мобиле начинаешь вводить текст, то открывается клавиатура. Если открыть сайт просто в браузере, то размер сайта меняется и поле ввода смещается вверх и все хорошо.
Но если открыть сайт как PWA, то при появлении клавиатуры сайт не подстраивается под новый размер, тем самым блок, куда вводится текст становится не видимым.
Тут видно textarea, кнопку отправить и так далее.

А тут нет, потому что клавиатура все закрывает.


Как сделать так, чтобы если сайт открыт как pwa, то размер сайта подстраивался под размер с клавиатурой и без.

Comments

[Hyubert]

попробуйте

body {
  height: 100vh;
}

[Александр Петров]

Hyubert, неа....не прокатило( Но идея была хороша!

[Hyubert]

Александр Петров, ну если посмотреть на https://codepen.io/pen/ то они с calc и flex смогли добиться такого ефекта.

[Александр Петров]

Hyubert, но https://codepen.io/pen/ не открывается как PWA приложение.

[Hyubert]

Александр Петров, нет но в мобильной версии подстраиваеться под клавиатуру с помощу css, это то что нужно

[Александр Петров]

Hyubert, да в обычной мобильной версии работает как надо....в том то и дело(