iOS上のPWA版Cosenseでstatus barがホームインジケーターに隠れないようにするUserCSS
iOS上のPWA版Cosenseでstatus barがホームインジケーターに隠れないようにするUserCSS
PWAかつ縦画面かつiOS端末のとき、heightとpadding-bottomを変更する
本当はenv(safe-area-inset-bottom)が使いたかったが、viewport-fit=coverが設定されていない限り使えないようなので仕方なく決め打ち
値は適当
code:style.css
:root {
--safe-area-inset-bottom: 18px;
}
@media (display-mode: standalone) and (orientation: portrait) {
htmldata-os*="ios" {
.status-bar {
height: calc(20px + var(--safe-area-inset-bottom));
div {
padding-bottom: var(--safe-area-inset-bottom) !important;
}
}
}
}
References
Fix: Client iOS 環境下の PWA にて、 Home Indicator の余白が正常に描画されない問題の修正 by junt1458 · Pull Request #40 · tsukumijima/KonomiTV · GitHub
#2025-01-10 20:02:33 雑に書いた