From 6cf88e2767dfa310e4ce5151f7b9143d2ddc6930 Mon Sep 17 00:00:00 2001
From: Thomas Heyenbrock <thomas.heyenbrock@gmail.com>
Date: Fri, 1 Jul 2022 10:20:25 +0200
Subject: [PATCH] set default background colors via css variables (#2530)

---
 packages/graphiql-react/src/editor/style/codemirror.css | 2 +-
 packages/graphiql/src/css/app.css                       | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/graphiql-react/src/editor/style/codemirror.css b/packages/graphiql-react/src/editor/style/codemirror.css
index 8129212e358..3b2b26b2fef 100644
--- a/packages/graphiql-react/src/editor/style/codemirror.css
+++ b/packages/graphiql-react/src/editor/style/codemirror.css
@@ -16,7 +16,7 @@
 .CodeMirror,
 .CodeMirror-gutters {
   background: none;
-  background-color: var(--color-neutral-0);
+  background-color: var(--editor-background, var(--color-neutral-0));
 }
 
 /* No padding around line number */
diff --git a/packages/graphiql/src/css/app.css b/packages/graphiql/src/css/app.css
index 290ff3fdaa6..543b2072e9d 100644
--- a/packages/graphiql/src/css/app.css
+++ b/packages/graphiql/src/css/app.css
@@ -121,6 +121,7 @@
 }
 
 .graphiql-container .result-window {
+  --editor-background: var(--color-neutral-7);
   flex: 1;
   height: 100%;
   position: relative;