From 33dbfe4c6f09d6cd9610e0166afeff8017be9685 Mon Sep 17 00:00:00 2001
From: Mathias Jakobsen <mathias.jakobsen@overleaf.com>
Date: Tue, 19 Aug 2025 15:02:40 +0100
Subject: [PATCH] Merge pull request #27953 from
 overleaf/mj-editor-color-scheme

[web] Specify CSS color-scheme based on editor theme

GitOrigin-RevId: dda4039b7fcc4aecc7ed3f96efe15518599c9226
---
 .../web/frontend/js/features/history/extensions/theme.ts  | 8 +++++++-
 .../js/features/source-editor/extensions/theme.ts         | 6 ++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/services/web/frontend/js/features/history/extensions/theme.ts b/services/web/frontend/js/features/history/extensions/theme.ts
index 8ddf312748..3c51968e74 100644
--- a/services/web/frontend/js/features/history/extensions/theme.ts
+++ b/services/web/frontend/js/features/history/extensions/theme.ts
@@ -45,7 +45,13 @@ const createThemeFromOptions = ({
   ]
 }
 
-const baseTheme = EditorView.theme({
+const baseTheme = EditorView.baseTheme({
+  '&light.cm-editor': {
+    colorScheme: 'light',
+  },
+  '&dark.cm-editor': {
+    colorScheme: 'dark',
+  },
   '.cm-content': {
     fontSize: 'var(--font-size)',
     fontFamily: 'var(--source-font-family)',
diff --git a/services/web/frontend/js/features/source-editor/extensions/theme.ts b/services/web/frontend/js/features/source-editor/extensions/theme.ts
index 7b0d78f73c..fb82a45644 100644
--- a/services/web/frontend/js/features/source-editor/extensions/theme.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/theme.ts
@@ -92,6 +92,12 @@ const createThemeFromOptions = ({
  * Base styles that can have &dark and &light variants
  */
 const baseTheme = EditorView.baseTheme({
+  '&light.cm-editor': {
+    colorScheme: 'light',
+  },
+  '&dark.cm-editor': {
+    colorScheme: 'dark',
+  },
   '.cm-content': {
     fontSize: 'var(--font-size)',
     fontFamily: 'var(--source-font-family)',