feat(FN-2661): add keyboard-aware mobile chat layouts
- Add a shared useMobileKeyboard hook that tracks visualViewport overlap on mobile browsers - Apply keyboard overlap CSS variables to QuickChatFAB so fullscreen mobile panels resize above the virtual keyboard - Apply the same keyboard-aware sizing to ChatView mobile thread layout and auto-scroll messages when keyboard opens - Expand ChatView, QuickChatFAB, and hook test coverage for mobile keyboard detection and viewport-resize behavior
This commit is contained in:
@@ -768,6 +768,11 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
.chat-thread[style*="--keyboard-overlap"] {
|
||||
height: calc(var(--vv-height, calc(100dvh - var(--keyboard-overlap, 0px))) - var(--header-height));
|
||||
max-height: calc(var(--vv-height, calc(100dvh - var(--keyboard-overlap, 0px))) - var(--header-height));
|
||||
}
|
||||
|
||||
/* On mobile, the "New Chat" affordance moves to a full-width pinned
|
||||
footer. The desktop top-header button is hidden to free the screen
|
||||
space for the search field and session list. */
|
||||
|
||||
Reference in New Issue
Block a user