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