From 105c7f54466b5f5f1f5754607d5852a147171802 Mon Sep 17 00:00:00 2001
From: Raymond Hill <rhill@raymondhill.net>
Date: Thu, 17 Nov 2022 09:25:20 -0500
Subject: [PATCH] Fix visual of DOM inspector layer in dark theme mode

Related discussion:
- https://github.com/uBlockOrigin/uBlock-issues/discussions/2359
---
 src/js/scriptlets/dom-inspector.js | 7 +++++++
 src/js/scriptlets/epicker.js       | 2 +-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/js/scriptlets/dom-inspector.js b/src/js/scriptlets/dom-inspector.js
index 686ae4a28..2f0abf04c 100644
--- a/src/js/scriptlets/dom-inspector.js
+++ b/src/js/scriptlets/dom-inspector.js
@@ -784,6 +784,12 @@ const bootstrap = function(ev) {
     }
     const pickerDoc = ev.target.contentDocument;
 
+    pickerDoc.documentElement.style.setProperty(
+        'color-scheme',
+        'dark light',
+        'important'
+    );
+
     const style = pickerDoc.createElement('style');
     style.textContent = [
         'body {',
@@ -855,6 +861,7 @@ pickerRoot.style.cssText = [
     'border: 0',
     'border-radius: 0',
     'box-shadow: none',
+    'color-scheme: light dark',
     'display: block',
     'height: 100%',
     'left: 0',
diff --git a/src/js/scriptlets/epicker.js b/src/js/scriptlets/epicker.js
index 875839b81..363ec9f99 100644
--- a/src/js/scriptlets/epicker.js
+++ b/src/js/scriptlets/epicker.js
@@ -1272,6 +1272,7 @@ const pickerCSSStyle = [
     'border: 0',
     'border-radius: 0',
     'box-shadow: none',
+    'color-scheme: light dark',
     'display: block',
     'filter: none',
     'height: 100vh',
@@ -1291,7 +1292,6 @@ const pickerCSSStyle = [
     'visibility: hidden',
     'width: 100%',
     'z-index: 2147483647',
-    'color-scheme: light dark',
     ''
 ];