fix: mobile toolbar height — icons no longer overflow

- .mobile-toolbar: 56px → 64px + padding 4px (was 0)
- .main-layout padding-bottom: 56px → 64px
- .mt-btn: height auto + min-height 48px (was fixed 48px)
- .mt-btn: gap 3px (was 2px), padding 4px (was 2px)
This commit is contained in:
2026-07-23 23:21:32 -04:00
parent 93d0bda627
commit d2953d98f9
+9 -8
View File
@@ -7357,22 +7357,22 @@ body.popup-mode .content-area {
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
height: 56px; height: 64px;
background: var(--bg-secondary); background: var(--bg-secondary);
border-top: 1px solid var(--border); border-top: 1px solid var(--border);
z-index: 900; z-index: 900;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
padding: 0 4px; padding: 4px 4px;
padding-bottom: env(safe-area-inset-bottom, 0); padding-bottom: calc(4px + env(safe-area-inset-bottom, 0));
-webkit-backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
backdrop-filter: blur(12px); backdrop-filter: blur(12px);
} }
/* Push content up to avoid toolbar overlap */ /* Push content up to avoid toolbar overlap */
.main-layout { .main-layout {
padding-bottom: 56px; padding-bottom: 64px;
padding-bottom: calc(56px + env(safe-area-inset-bottom, 0)); padding-bottom: calc(64px + env(safe-area-inset-bottom, 0));
} }
.editor-modal.active ~ .main-layout { .editor-modal.active ~ .main-layout {
padding-bottom: 0; padding-bottom: 0;
@@ -7419,10 +7419,11 @@ body.popup-mode .content-area {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 2px; gap: 3px;
flex: 1; flex: 1;
height: 48px; height: auto;
padding: 2px 4px; min-height: 48px;
padding: 4px 4px;
border: none; border: none;
border-radius: 8px; border-radius: 8px;
background: transparent; background: transparent;