height と padding-bottom を変更する env(safe-area-inset-bottom) が使いたかったが、 viewport-fit=cover が設定されていない限り使えないようなので仕方なく決め打ちstyle.css:root {
--safe-area-inset-bottom: 18px;
}
@media (display-mode: standalone) and (orientation: portrait) {
html[data-os*="ios"] {
.status-bar {
height: calc(20px + var(--safe-area-inset-bottom));
> div {
padding-bottom: var(--safe-area-inset-bottom) !important;
}
}
}
}