romtuck/openclaw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: move safe-area padding to shell container

Browse Source 
Addresses Codex review feedback - applying safe-area padding to body
while body has height:100% + overflow:hidden clips the bottom.

Now applies safe-area insets to .shell container with adjusted height
calc to prevent clipping.
This commit is contained in:
Austin S. Lin 2026-01-29 08:15:48 -05:00
parent 7186600608
commit e8cfafc4da
2 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
ui/src/styles/base.css
View File

@ -197,15 +197,6 @@ body {
overflow: hidden; overflow: hidden;
} }
/* iOS safe area support */
@supports (padding: env(safe-area-inset-top)) {
body {
padding-top: env(safe-area-inset-top);
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
}
}
body { body {
margin: 0; margin: 0;
font: 400 14px/1.55 var(--font-body); font: 400 14px/1.55 var(--font-body);

11
ui/src/styles/layout.mobile.css
View File

@ -4,6 +4,17 @@
/* Tablet: Horizontal nav - sticky header */ /* Tablet: Horizontal nav - sticky header */
@media (max-width: 1100px) { @media (max-width: 1100px) {
/* iOS safe area support - apply to shell container */
@supports (padding: env(safe-area-inset-top)) {
.shell {
padding-top: env(safe-area-inset-top);
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
padding-bottom: env(safe-area-inset-bottom);
height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
}
}
/* Keep topbar sticky on mobile */ /* Keep topbar sticky on mobile */
.topbar { .topbar {
position: sticky; position: sticky;