Задать вопрос
@SmoKE_xD
pwa

Как победить safe-area?

Есть фуллскрин PWA приложение. Само собой использую safe-area повсеместно, однако заметил такой баг:
При открытии приложения - все хорошо, отступы применяются, однако после релода страницы или перехода на другую страницу safe-area всегда 0, при этом, если дернуть за шторку - она опять оживает и применяет отступы.
Что я делаю не так?
  • Вопрос задан
  • 548 просмотров
Комментировать
Подписаться 3 Сложный Комментировать
Решение пользователя Александр К ответам на вопрос (1)
@SmoKE_xD Автор вопроса
Решение - https://github.com/zhetengbiji/safeAreaInsets + после загрузки пушить переменную из локал сторадж
if(safeAreaInsets.support && safeAreaInsets.top !== 0) {
            localStorage.setItem('safe-area-inset-top', safeAreaInsets.top);
        }
        if(safeAreaInsets.support && safeAreaInsets.bottom !== 0) {
            localStorage.setItem('safe-area-inset-bottom', safeAreaInsets.bottom);
        }

        if(localStorage.getItem('safe-area-inset-top') > 0) {
            document.documentElement.style.setProperty('--sat', localStorage.getItem('safe-area-inset-top') + "px");
        }
        if(localStorage.getItem('safe-area-inset-bottom') > 0) {
            document.documentElement.style.setProperty('--sab', localStorage.getItem('safe-area-inset-bottom') + "px");
        }
Ответ написан
Комментировать
Комментировать