Give the canvas dot grid the token colour React Flow actually reads
`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) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016ZeGnqVsf5VHQqvz4HdUhN
This commit is contained in:
@@ -8,7 +8,7 @@
|
|||||||
|
|
||||||
.react-flow {
|
.react-flow {
|
||||||
--xy-background-color: var(--background);
|
--xy-background-color: var(--background);
|
||||||
--xy-background-pattern-dots-color: color-mix(
|
--xy-background-pattern-color: color-mix(
|
||||||
in srgb,
|
in srgb,
|
||||||
var(--muted-foreground) 30%,
|
var(--muted-foreground) 30%,
|
||||||
transparent
|
transparent
|
||||||
@@ -251,7 +251,7 @@
|
|||||||
*/
|
*/
|
||||||
--xy-edge-stroke-width: 3;
|
--xy-edge-stroke-width: 3;
|
||||||
--edge-pulse-width: 4;
|
--edge-pulse-width: 4;
|
||||||
--xy-background-pattern-dots-color: color-mix(
|
--xy-background-pattern-color: color-mix(
|
||||||
in srgb,
|
in srgb,
|
||||||
var(--muted-foreground) 22%,
|
var(--muted-foreground) 22%,
|
||||||
transparent
|
transparent
|
||||||
|
|||||||
Reference in New Issue
Block a user