fix(session): header backdrop-blur off while the context-tree band is open - #97
Merged
Merged
Conversation
… open With the context-tree block open the sticky header grows to ~300px and the band sits inside the pl-4 gutter — backdrop-blur(10px) samples transcript content through that transparent 16px strip and smears it into a grey streak along the straight left edge (worst in light theme). The band is opaque below the 48px title strip, so the blur contributed nothing there. Slim headers keep the frosted fade. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
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
1 participant
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.
What
Kate reported a soft grey vertical smear ("bleed") along the transcript's left edge in sessions showing the context-tree/constellation band, light theme.
Root cause (reproduced + pixel-diffed in a browser harness)
The sticky session header (
[data-session-title], message-timeline.tsx) carriesbackdrop-blur-[10px]over its whole padding box, with a background gradient opaque only for the first 48px. Slim headers hide the blur under the opaque title strip — but when the context-tree band renders, the header grows to ~300px and the band sits inside themd:pl-4padding. That leaves a 16px transparent gutter ~225px tall where the blur is fully exposed: transcript content scrolling beneath (straight card edges, dark text) gets sampled and smeared into a grey streak. The right gutter has the same defect but ragged line-ends make it invisible. A/B screenshots with onlybackdrop-filtertoggled produce a pixel-diff strip exactly in the gutter with Gaussian falloff — confirmed causation.Fix
One-line gate, mirroring the existing
pb-4/pb-2conditionals two lines below:"backdrop-blur-[10px]": !contextTreeVisible(). With the tree open the band is opaque below the title strip anyway, so the blur contributed nothing there; slim headers keep the frosted fade. (If the frosted look must survive with the tree open, the thorough alternative is a maskedinset-0underlay whose blur fades with the gradient — deliberately not taken here.)Note: #66 (message-timeline audit stack) touches this file — trivial to rebase whichever lands second.
Verification
npm run lint: 0 errors;tsgo -bpackages/app: clean🤖 Generated with Claude Code