fix(web): extend graph gradient backdrop across the chat panel#1060
Open
sreedharsreeram wants to merge 4 commits into
Open
fix(web): extend graph gradient backdrop across the chat panel#1060sreedharsreeram wants to merge 4 commits into
sreedharsreeram wants to merge 4 commits into
Conversation
The chat-page layout split into a graph rail (left) and chat shell
(right). The gradient + dotted-grid backdrop lived inside the rail with
overflow-hidden, so the chat side fell back to flat #05080D — pure black.
Lift the backdrop to span both columns so the gradient flows continuously:
- ChatGraphContextRail gains a `showBackdrop` prop (default true); when
false it skips its own gradient/grid/opaque bg.
- The page-desktop chat layout renders one shared backdrop behind both
columns and passes showBackdrop={false} to the rail.
- Drop the rail's right-edge fade-to-#05080D overlay, which painted a
hard vertical seam over the now-continuous gradient.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
Claude finished @sreedharsreeram's task in 58s —— View job Review Complete
Overview: Lifts the gradient backdrop from inside Issues found: None — this looks good to ship. The implementation is clean:
Score: 10/10 |
sreedharsreeram
requested review from
MaheshtheDev
and removed request for
Dhravya
Deploying with
|
| Status | Name | Latest Commit | Updated (UTC) |
|---|---|---|---|
| ✅ Deployment successful! View logs |
supermemory-mcp | 39e9c75 | Jun 07 2026, 04:27 AM |
![claude[bot]](https://avatars.githubusercontent.com/in/1236702?s=60&v=4){kind=small}
There was a problem hiding this comment.
Overview: Lifts the gradient backdrop from inside ChatGraphContextRail to the parent layout so it spans both the graph rail and chat panel, eliminating the hard seam at the graph edge.
Issues found: None — this looks good to ship.
The implementation is clean:
- The
showBackdropprop defaults totrue, maintaining backwards compatibility for any other potential consumers - Z-index stacking is correct: shared backdrop at
z-0, rail content atz-[2]/z-20, chat container atz-[2] - The
cn()utility correctly handles the conditionalshowBackdrop && "bg-[#05080D]"pattern - Removing the right-edge fade overlay is the correct fix for eliminating the hard seam
Score: 10/10
Deploying with
|
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs |
supermemory-app | 39e9c75 | Commit Preview URL Branch Preview URL |
Jun 07 2026, 04:28 AM |
Sharing the gradient across both columns removed the seam but also any visual boundary, so the graph bled into the chat. Add a 1px vertical divider that fades at top/bottom (transparent → white/15 → transparent) to mark the boundary without reintroducing a hard fade-to-black band. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Sharing the gradient made the graph and chat equally bright, so they blended with no separation. Match prod: add a gentle left→right darkening over the chat column so it reads as a distinct, recessed panel while the shared dots and glow still show through. The hairline divider stays for definition. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The 1px hairline read as an ugly hard line cutting down the panel. Prod separates the graph and chat with a soft fade, not a literal line, so remove the hairline and let the chat-side darkening overlay handle the separation on its own. Co-Authored-By: Claude Opus 4.8 (1M context) <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
In the Nova chat-page layout, the panel splits into a graph rail (left) and the chat shell (right). The gradient + dotted-grid backdrop lived inside the rail with
overflow-hidden, so it was clipped at the graph's edge and the chat side fell back to flat#05080D— pure black.This lifts the backdrop to span both columns so the gradient flows continuously across the whole panel.
Changes
ChatGraphContextRailgains ashowBackdropprop (defaulttrue); whenfalseit skips its own gradient / dotted grid / opaque background.chat/index.tsx) renders a single shared backdrop behind both columns and passesshowBackdrop={false}to the rail.fade-to-#05080Doverlay, which painted a hard vertical seam on top of the now-continuous gradient.Only the desktop chat-page layout is affected — mobile and the floating-sidebar chat variants are unchanged.
Before / After
🤖 Generated with Claude Code