From 7979b1c16ab6a6b073cb08c1f52e8c665d90f5e1 Mon Sep 17 00:00:00 2001 From: Sreeram Sreedhar Date: Sat, 6 Jun 2026 18:38:15 -0700 Subject: [PATCH 1/4] fix(web): extend graph gradient backdrop across the chat panel MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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) --- .../chat/chat-graph-context-rail.tsx | 19 ++++++++++++++----- apps/web/components/chat/index.tsx | 17 +++++++++++++++-- 2 files changed, 29 insertions(+), 7 deletions(-) diff --git a/apps/web/components/chat/chat-graph-context-rail.tsx b/apps/web/components/chat/chat-graph-context-rail.tsx index cb83141bd..c89c83396 100644 --- a/apps/web/components/chat/chat-graph-context-rail.tsx +++ b/apps/web/components/chat/chat-graph-context-rail.tsx @@ -13,10 +13,12 @@ export function ChatGraphContextRail({ messages, containerTags, className, + showBackdrop = true, }: { messages: UIMessage[] containerTags?: string[] | null className?: string + showBackdrop?: boolean }) { const { effectiveContainerTags } = useProject() const graphContainerTags = @@ -32,14 +34,22 @@ export function ChatGraphContextRail({
- -
-
+ {showBackdrop && ( + <> + +
+
+ + )}

Memory map

@@ -48,7 +58,6 @@ export function ChatGraphContextRail({ : "Memories used by Nova will be highlighted here"}

-
{chatHistorySheet} {isPageDesktop ? ( -
+
+ {/* Shared backdrop spanning both the graph rail and the chat so the + gradient flows continuously across the whole panel instead of + stopping at the graph edge. */} +
+ +
+
+
-
+
{pageDesktopToolbarRow}
{shell} From 27df0845268915192e22d86f647ad4328e681624 Mon Sep 17 00:00:00 2001 From: Sreeram Sreedhar Date: Sat, 6 Jun 2026 21:21:06 -0700 Subject: [PATCH 2/4] fix(web): add hairline divider between graph and chat panels MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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) --- apps/web/components/chat/index.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/apps/web/components/chat/index.tsx b/apps/web/components/chat/index.tsx index 2d7bc397f..45a867774 100644 --- a/apps/web/components/chat/index.tsx +++ b/apps/web/components/chat/index.tsx @@ -1621,6 +1621,9 @@ export function ChatSidebar({ chatProject === AUTO_CHAT_SPACE_ID ? null : [chatProject] } /> + {/* Hairline divider between the graph and the chat. A soft, edge-faded + line keeps the boundary legible without breaking the shared gradient. */} +
{pageDesktopToolbarRow}
From 78d9494ed25bb489c98a95133fed0fd23cad06ce Mon Sep 17 00:00:00 2001 From: Sreeram Sreedhar Date: Sat, 6 Jun 2026 21:23:40 -0700 Subject: [PATCH 3/4] fix(web): recess the chat panel with a soft darkening overlay MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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) --- apps/web/components/chat/index.tsx | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/apps/web/components/chat/index.tsx b/apps/web/components/chat/index.tsx index 45a867774..7743907ad 100644 --- a/apps/web/components/chat/index.tsx +++ b/apps/web/components/chat/index.tsx @@ -1625,9 +1625,14 @@ export function ChatSidebar({ line keeps the boundary legible without breaking the shared gradient. */}
- {pageDesktopToolbarRow} -
- {shell} + {/* Soft left→right darkening so the chat reads as a distinct, + recessed panel (like prod) while the dots/glow still show through. */} +
+
+ {pageDesktopToolbarRow} +
+ {shell} +
From 39e9c752d0cc704c816d3a82f0291cb944df4c6f Mon Sep 17 00:00:00 2001 From: Sreeram Sreedhar Date: Sat, 6 Jun 2026 21:26:17 -0700 Subject: [PATCH 4/4] fix(web): drop hard hairline divider, keep soft fade only 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) --- apps/web/components/chat/index.tsx | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/apps/web/components/chat/index.tsx b/apps/web/components/chat/index.tsx index 7743907ad..73e45a21d 100644 --- a/apps/web/components/chat/index.tsx +++ b/apps/web/components/chat/index.tsx @@ -1621,12 +1621,10 @@ export function ChatSidebar({ chatProject === AUTO_CHAT_SPACE_ID ? null : [chatProject] } /> - {/* Hairline divider between the graph and the chat. A soft, edge-faded - line keeps the boundary legible without breaking the shared gradient. */} -
{/* Soft left→right darkening so the chat reads as a distinct, - recessed panel (like prod) while the dots/glow still show through. */} + recessed panel (like prod) while the dots/glow still show + through. The gradient handles the separation — no hard line. */}
{pageDesktopToolbarRow}