fix(terminal): anchor header to top when mobile keyboard is open

When the soft keyboard opens on mobile, the overlay's align-items:center was vertically centering the shrunken modal, pushing the header/tabs out of view. Add a rule to switch to align-items:flex-start when --keyboard-overlap is detected.
This commit is contained in:
gsxdsm
2026-04-26 11:43:43 -07:00
parent db58f29abc
commit 845fed1d50

View File

@@ -726,9 +726,11 @@
/* === Terminal Modal Mobile Responsive === */
@media (max-width: 768px) {
.terminal-modal {
.modal.terminal-modal {
width: 100%;
max-width: 100%;
min-height: 100vh;
min-height: 100dvh;
height: 100vh;
height: 100dvh;
max-height: 100vh;
@@ -884,6 +886,14 @@
overflow: hidden;
}
/* Anchor the overlay to the top when the keyboard is open so the header
stays visible. Without this, align-items:center (from the non-keyboard
modal-overlay:has rule) vertically centers the shrunken modal and pushes
the top area out of the visible viewport. */
.modal-overlay:has(.terminal-modal[style*="--keyboard-overlap"]) {
align-items: flex-start !important;
}
/* Terminal tab close button: touch target on mobile */
.terminal-tab-close {
min-width: 36px;