From 627b7abd62eb27f70af3934ca45b858103d4f30d Mon Sep 17 00:00:00 2001
From: Pavel <19418601+rakleed@users.noreply.github.com>
Date: Mon, 11 Sep 2023 16:02:54 +0300
Subject: [PATCH] feat[devtools/extension]: add dark theme for popup (#27330)

## Summary

If the system/browser uses a dark theme, then the extension popup still
remains with a light background. And so that the eyes do not hurt in a
dark room, you need a dark theme.

## How did you test this change?

Make sure the dark theme is enabled on your system/browser.

**Before:**

![Screenshot 2023-09-02 at 22 20
56](https://github.com/facebook/react/assets/19418601/f7166ea7-f562-4d11-8851-be08fa9629a7)

**After:**

![Screenshot 2023-09-02 at 22 21
30](https://github.com/facebook/react/assets/19418601/e51ecd5f-3e71-4193-83ff-a548bce76bd4)
---
 packages/react-devtools-extensions/popups/shared.css | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/react-devtools-extensions/popups/shared.css b/packages/react-devtools-extensions/popups/shared.css
index cd3d35d005897..9c9c1ecd96cbd 100644
--- a/packages/react-devtools-extensions/popups/shared.css
+++ b/packages/react-devtools-extensions/popups/shared.css
@@ -4,4 +4,10 @@ html, body {
 
 body {
   margin: 8px;
-}
\ No newline at end of file
+}
+
+@media (prefers-color-scheme: dark) {
+  html {
+    color-scheme: dark;
+  }
+}