fix(ui): make the macOS 26 menu bar popup fill opaque so its shadow hugs a solid panel#652
Merged
Merged
Conversation
…ugs a solid panel On macOS 26 Liquid Glass, containerBackground(_, for: .window) is composited through a translucent glass backdrop (CABackdropLayer), so the opaque Color passed by #566 was still rendered see-through. The non-opaque popover window let the desktop bleed through and the native shadow detached from the content on light backgrounds, reopening #492 as #646. Draw the fill as ordinary content instead: an opaque window-colored rounded rectangle matching the native 16pt continuous corner, behind the menu. It renders as a real opaque layer the system shadow can hug. Verified on macOS 26 via layer inspection (a full-size opaque corner-16 layer now backs the window) and by capturing the popover in light and dark mode. Fixes #646
Addresses Greptile feedback: extract the measured 16pt radius into macOS26PopoverCornerRadius so the coupling to the system popover shape is documented and future OS changes are a one-line update.
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
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
On macOS 26 the menu bar popup's drop shadow detaches from the panel (equivalently, the fill looks like it does not stretch to the popup's edges), worst on a light background. This draws the popup fill as an opaque rounded layer so the system shadow hugs a solid panel. Fixes the recurring #646, which is the same defect as #492.
Validation
Root-caused and verified on macOS 26 (Tahoe, Darwin 25.x) by inspecting the live
MenuBarExtra(.window)backing window and its layer tree:CABackdropLayer; there is no full-size opaque layer anywhere in the tree. The popover window isisOpaque=falsewith a clear background, so the desktop bleeds through and the system shadow (cast around the full rounded frame) detaches.containerBackground(_, for: .window)routes any value, including an opaqueColor, through that glass backdrop, which is why Fix translucent menu bar popup background on macOS 26 #566's material-to-color swap changed nothing.bgAlpha=1.0,cornerRadius=16continuous, frame{{0,0},{340,329.5}}) now backs the window, matching the native shape exactly and reaching all four edges (so no Fix menu bar popup double border #403 double-border regression).Linked issues
Fixes #646
Refs #492, #566, #403
Risk / rollout notes
.windowBackgroundmaterial) and the macOS 14 fallback are unchanged.Greptile Summary
Fixes a recurring macOS 26 menu bar popup shadow issue by replacing
containerBackground(_, for: .window)with a plain SwiftUI.backgroundlayer carrying an opaqueRoundedRectangle. On macOS 26,containerBackgroundroutes through the system's Liquid GlassCABackdropLayer, making even an opaqueColortranslucent; using.backgroundbypasses that path and produces a fully opaque fill. The macOS 15–25 and macOS 14 code paths are not touched.containerBackground(Color(nsColor: .windowBackgroundColor), for: .window)tocontent.background { RoundedRectangle(cornerRadius: ..., style: .continuous).fill(...) }, producing the opaque layer that the system shadow can hug.macOS26PopoverCornerRadius = 16(a measured system value) is extracted as aprivate static letwith a doc-comment explaining why it exists and what breaks if it drifts.Confidence Score: 5/5
Safe to merge; the change is narrowly scoped to the macOS 26 branch of a single modifier, and the previous feedback about extracting the magic constant has been addressed.
The fix is a small, well-bounded substitution in one platform branch. The author verified it with live layer-tree inspection and confirmed the opaque layer reaches all four window edges. The macOS 15–25 and macOS 14 paths are untouched.
No files require special attention.
Important Files Changed
Reviews (2): Last reviewed commit: "refactor(ui): name the macOS 26 popover ..." | Re-trigger Greptile