From b2ade125183230c1772e9c10a06ca220c8295999 Mon Sep 17 00:00:00 2001 From: stroblme Date: Sun, 23 Aug 2026 06:20:26 +0200 Subject: [PATCH] Give the canvas dot grid the token colour React Flow actually reads MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit `flow.css` set `--xy-background-pattern-dots-color`, which nothing reads: xyflow's `.react-flow__background-pattern.dots` reads `--xy-background-pattern-color` and only falls back to the `-dots-color-default` literal. The grid was therefore pinned to `#91919a` in both themes — and with no `colorMode` prop the `.react-flow.dark` default never applies either, so it read as a light-mode grid on a dark canvas. Co-Authored-By: Claude Opus 5 (1M context) Claude-Session: https://claude.ai/code/session_016ZeGnqVsf5VHQqvz4HdUhN --- frontend/src/components/Flow/flow.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/components/Flow/flow.css b/frontend/src/components/Flow/flow.css index f973f7c..a20575c 100644 --- a/frontend/src/components/Flow/flow.css +++ b/frontend/src/components/Flow/flow.css @@ -8,7 +8,7 @@ .react-flow { --xy-background-color: var(--background); - --xy-background-pattern-dots-color: color-mix( + --xy-background-pattern-color: color-mix( in srgb, var(--muted-foreground) 30%, transparent @@ -251,7 +251,7 @@ */ --xy-edge-stroke-width: 3; --edge-pulse-width: 4; - --xy-background-pattern-dots-color: color-mix( + --xy-background-pattern-color: color-mix( in srgb, var(--muted-foreground) 22%, transparent