From 15c26a107330c9d274c93114da7dcfb0ae0638a0 Mon Sep 17 00:00:00 2001
From: Thomas Rientjes <synzvato@protonmail.com>
Date: Fri, 17 May 2019 21:23:03 +0200
Subject: [PATCH] Add dark mode support to the popup panel

---
 pages/popup/popup.css | 104 ++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 104 insertions(+)

diff --git a/pages/popup/popup.css b/pages/popup/popup.css
index af7b46f..c6f1f0b 100644
--- a/pages/popup/popup.css
+++ b/pages/popup/popup.css
@@ -258,3 +258,107 @@ footer {
         width: 348px;
     }
 }
+
+@media (prefers-color-scheme: dark) {
+
+    /**
+     * Sections
+     */
+
+    body {
+        background-color: #404040;
+        color: #f9f9fa;
+    }
+
+    header {
+        border-bottom-color: #292929;
+    }
+
+    /**
+     * Lists
+     */
+
+    .list-item {
+        background-color: #484848;
+        border-color: #292929;
+        color: #f0f0f0;
+    }
+
+    .sublist {
+        background-color: #323232;
+        border-color: #292929;
+        box-shadow: inset 0 2px 10px #292929;
+    }
+
+    .sublist:last-child {
+        border-bottom-color: #292929;
+    }
+
+    .sublist-item {
+        border-bottom-color: #2c2c2c;
+        color: #f0f0f0;
+    }
+
+    /**
+     * Buttons
+     */
+
+    .button {
+        background-color: #3c3c3c;
+        border-color: #323232;
+        color: #bbb;
+    }
+
+    .button:hover {
+        background-color: #434343;
+    }
+
+    .button:active {
+        background-color: #393939;
+    }
+
+    .button-toggle {
+        border-color: #363636;
+        color: #636363;
+    }
+
+    .button-toggle.active {
+        border-color: #323232;
+    }
+
+    /**
+     * Links
+     */
+
+    .link-text {
+        color: #7d7d7d;
+    }
+
+    .link-text:hover {
+        color: #dadada;
+    }
+
+    /**
+     * Miscellaneous
+     */
+
+    .badge {
+        color: #2d5042;
+    }
+
+    .description {
+        color: #dadada;
+    }
+
+    .label-domain {
+        color: #717171;
+    }
+
+    .panel:not(:last-child) {
+        border-bottom-color: #292929;
+    }
+
+    .side-note {
+        color: #888;
+    }
+}
-- 
GitLab