diff --git a/src/web-ui/src/flow_chat/components/ChatInput.scss b/src/web-ui/src/flow_chat/components/ChatInput.scss index 71da60a4d..d1cf0fd55 100644 --- a/src/web-ui/src/flow_chat/components/ChatInput.scss +++ b/src/web-ui/src/flow_chat/components/ChatInput.scss @@ -614,7 +614,7 @@ position: relative; width: 100%; height: auto; - min-height: 76px; + min-height: 56px; max-height: 500px; display: flex; flex-direction: column; @@ -695,7 +695,7 @@ &--multi-line { // Max ~5 lines: 5 × (14px × 1.45) ≈ 101px + padding + action bar ≈ 160px .bitfun-chat-input__input-area { - min-height: 56px; + min-height: 28px; .rich-text-input { max-height: 102px; // ~5 lines of text @@ -796,7 +796,7 @@ flex-direction: column; align-items: stretch; width: 100%; - min-height: 56px; + min-height: 28px; overflow: visible; // Last line descenders + clearance above the action row (send is 28px tall in a short bar) padding-bottom: 4px; diff --git a/src/web-ui/src/flow_chat/components/ScrollToLatestBar.scss b/src/web-ui/src/flow_chat/components/ScrollToLatestBar.scss index 70bf442ec..3db58999d 100644 --- a/src/web-ui/src/flow_chat/components/ScrollToLatestBar.scss +++ b/src/web-ui/src/flow_chat/components/ScrollToLatestBar.scss @@ -13,8 +13,8 @@ pointer-events: none; // Default height fallback (overridden by inline style when inputHeight is measured). - // Active non-expanded: ~80px input + 4px gap + 6px clearance + 24px gradient ≈ 114px. - height: 114px; + // Active non-expanded: ~64px input + 4px gap + 6px clearance + 24px gradient ≈ 98px. + height: 98px; // Height follows live composer measurements; do not animate layout. transition: none; @@ -54,7 +54,7 @@ // bottom is driven by inline style (inputHeight + 4 + 6); CSS value is fallback only. &__content { position: absolute; - bottom: 90px; + bottom: 74px; left: 0; right: 0; pointer-events: auto; diff --git a/src/web-ui/src/flow_chat/components/modern/VirtualMessageList.scss b/src/web-ui/src/flow_chat/components/modern/VirtualMessageList.scss index 373b2be22..397a08e1c 100644 --- a/src/web-ui/src/flow_chat/components/modern/VirtualMessageList.scss +++ b/src/web-ui/src/flow_chat/components/modern/VirtualMessageList.scss @@ -113,8 +113,8 @@ .message-list-footer { /* Inline height from VirtualMessageList (measured drop-zone + bottom inset + tail clearance). */ - height: 120px; - min-height: 72px; + height: 92px; + min-height: 56px; overflow-anchor: none; } diff --git a/src/web-ui/src/flow_chat/utils/flowChatScrollLayout.ts b/src/web-ui/src/flow_chat/utils/flowChatScrollLayout.ts index 06bb42e9c..5730e50b2 100644 --- a/src/web-ui/src/flow_chat/utils/flowChatScrollLayout.ts +++ b/src/web-ui/src/flow_chat/utils/flowChatScrollLayout.ts @@ -13,7 +13,7 @@ export const FLOWCHAT_MESSAGE_TAIL_CLEARANCE_PX = 24; export const SCROLL_TO_LATEST_INPUT_CLEARANCE_PX = 6; const FALLBACK_INPUT_BLOCK_ACTIVE_PX = 96; -const NORMAL_INPUT_BLOCK_SAFE_PX = 96; +const NORMAL_INPUT_BLOCK_SAFE_PX = 64; /** * Height of the Virtuoso footer spacer needed so the last message clears the floating input.