fix: prevent chat page layout shift hiding top navbar on Windows#473
Merged
jamiepine merged 1 commit intospacedriveapp:mainfrom Mar 24, 2026
Merged
Conversation
Three issues caused the top navbar to disappear and the chat input to get clipped when navigating to the Chat tab on Windows (Tauri): 1. The `zoom: 1.1` on body was applied unconditionally in Tauri but is only needed for WKWebView (macOS). On Windows (WebView2), it made content 10% taller than the viewport, causing overflow and scroll shifts. Now only applied on macOS. 2. `scrollIntoView()` in WebChatPanel propagated scroll to ancestor `overflow-hidden` containers, shifting the entire layout upward. Replaced with targeted `scrollTo()` on the messages container. 3. `textarea.focus()` in FloatingChatInput triggered browser scroll-to-focus behavior on ancestor containers. Added `preventScroll: true` to prevent this. Also added `overflow-hidden` on the root layout div as a safety net against any future scroll propagation. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (3)
WalkthroughUpdates focus behavior and auto-scrolling mechanics in the chat panel by replacing sentinel-element-based scrolling with direct container scrolling. Applies platform-specific zoom styling for macOS on Tauri startup. Adds overflow containment to the root layout container. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
5 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
zoom: 1.1on<body>was meant to compensate for WKWebView's smaller rendering scale, but was applied on all Tauri platforms. On Windows (WebView2/Chromium), this made content 10% taller than the viewport, causing overflow that hid the top navbar or clipped the chat input. Now only applied when running on macOS.scrollIntoViewwith targetedscrollTo:scrollIntoView()propagates scroll to all scrollable ancestors — including elements withoverflow: hidden— which shifted the entire root layout upward, hiding the top navbar. UsingscrollTo()directly on the messages container keeps scrolling contained.textarea.focus()in the floating chat input triggered the browser's scroll-to-focus behavior on ancestor containers. AddedpreventScroll: true.overflow-hiddento root layout: Safety net to prevent any future scroll propagation from shifting the layout.Test plan
zoom: 1.1still applies and the UI looks correct🤖 Generated with Claude Code