root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dashboard): pin mobile nav bar to page bottom when keyboard is open

Browse Source 
Decouples the nav-bar keyboard-open class from the gated mobileKeyboardOpen
flag so the bar stays pinned to bottom: 0 regardless of modal state or
platform, instead of floating up with the iOS visualViewport.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
gsxdsm
2026-05-23 09:45:30 -07:00
parent 63ec709811
commit 76429a820c
2 changed files with 14 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
.changeset/mobile-nav-bar-pin-on-keyboard.md Normal file
View File

@@ -0,0 +1,7 @@
---
"@fusion/dashboard": patch
---
fix(dashboard): keep mobile nav bar pinned to page bottom when keyboard opens
The mobile nav bar's `bottom` defaults to `var(--icb-bottom-offset)`, which on iOS equals the soft-keyboard height once it opens — floating the bar above the keyboard. The existing `.mobile-nav-bar--keyboard-open` override (which pins `bottom: 0`) was only applied when `!modalManager.anyModalOpen && isIOS()`, so the bar still tracked the keyboard with a modal open. Introduces `mobileNavKeyboardOpen = isMobile && keyboardOpen` as a nav-bar-only flag so the bar stays pinned in all keyboard cases. Content padding and ExecutorStatusBar remain on the gated `mobileKeyboardOpen` to preserve their existing behavior.

8
packages/dashboard/app/App.tsx
View File

@@ -472,6 +472,12 @@ function AppInner() {
// iOS doesn't shrink the layout viewport, so the iOS path keeps the // iOS doesn't shrink the layout viewport, so the iOS path keeps the
// hide-nav-on-keyboard behavior intact. // hide-nav-on-keyboard behavior intact.
const mobileKeyboardOpen = isMobile && keyboardOpen && !modalManager.anyModalOpen && isIOS(); const mobileKeyboardOpen = isMobile && keyboardOpen && !modalManager.anyModalOpen && isIOS();
// Nav-bar-only: pin the bar to the page bottom whenever the keyboard is up on
// mobile, regardless of modal state or platform. The bar's `bottom` defaults
// to `var(--icb-bottom-offset)`, which equals the keyboard height on iOS and
// would otherwise float the bar above the keyboard. We want the keyboard to
// simply cover the bar instead.
const mobileNavKeyboardOpen = isMobile && keyboardOpen;
// App-level scroll lock for inline editing (TaskCard inline edit, etc.): // App-level scroll lock for inline editing (TaskCard inline edit, etc.):
// when the keyboard is up outside of any modal, pin the body so iOS can't // when the keyboard is up outside of any modal, pin the body so iOS can't
// shift the document or visualViewport, and so the dashboard snaps back // shift the document or visualViewport, and so the dashboard snaps back
@@ -1905,7 +1911,7 @@ function AppInner() {
onChangeView={viewMode === "project" && currentProject ? handleTaskViewChange : () => {}} onChangeView={viewMode === "project" && currentProject ? handleTaskViewChange : () => {}}
footerVisible={viewMode === "project" && !!currentProject} footerVisible={viewMode === "project" && !!currentProject}
modalOpen={modalManager.anyModalOpen} modalOpen={modalManager.anyModalOpen}
keyboardOpen={mobileKeyboardOpen} keyboardOpen={mobileNavKeyboardOpen}
onOpenSettings={openSettingsWithNav} onOpenSettings={openSettingsWithNav}
onOpenActivityLog={openActivityLogWithNav} onOpenActivityLog={openActivityLogWithNav}
onOpenSystemStats={openSystemStatsWithNav} onOpenSystemStats={openSystemStatsWithNav}