X-Git-Url: https://git.wh0rd.org/?a=blobdiff_plain;f=popup.html;h=b8abe51010e0121290b8d49fdfd1afbb171e3865;hb=00a6ceea845df36c7596b1922c1989c509226886;hp=7ea22fe9daaf8d34b2d72ed3d567d64b08835d11;hpb=dce75bc9b6a72672cea2bcded0788fd9ea1def43;p=chrome-ext%2Fweb-power-switch.git

diff --git a/popup.html b/popup.html
index 7ea22fe..b8abe51 100644
--- a/popup.html
+++ b/popup.html
@@ -5,15 +5,32 @@
 <head>
 <meta charset='utf-8'/>
 <title>Web Power Switch Manager</title>
+
+<link rel='stylesheet' href='css/dark.css' media='(prefers-color-scheme: dark)'/>
+<link rel='stylesheet' href='css/light.css' media='(prefers-color-scheme: light), (prefers-color-scheme: no-preference)'/>
+<!-- Load theme override asap to help with initial loading/flashing. -->
+<link rel='stylesheet' href='' id='theme-override'/>
+<script src='theme-init.js'></script>
+
 <script src='common.js'></script>
 <script src='popup.js'></script>
 <style>
+button[name="theme"]::before {
+	content: var(--theme-text);
+	font-size: smaller;
+	font-weight: bold;
+}
+button[name="theme"] {
+	float: right;
+}
 table#buttons {
 	margin: 0px;
 	padding: 0px;
 	border-collapse: collapse;
 }
 body {
+	background-color: var(--body-color);
+	filter: var(--body-filter);
 	margin: 1px;
 	padding: 0px;
 	font-family: Arial, sans-serif;
