diff --git a/blocked.js b/blocked.js
index 462bc58..bbfb800 100644
--- a/blocked.js
+++ b/blocked.js
@@ -11,7 +11,7 @@ function processBlockInfo(info) {
// Set theme
let link = document.getElementById("themeLink");
if (link) {
- link.href = info.theme ? `/themes/${info.theme}.css` : "";
+ link.href = "/themes/" + (info.theme ? `${info.theme}.css` : "default.css");
}
}
diff --git a/common.js b/common.js
index 041b81d..7c60713 100644
--- a/common.js
+++ b/common.js
@@ -518,7 +518,7 @@ function createAccessCode(len) {
function setTheme(theme) {
let link = document.getElementById("themeLink");
if (link) {
- link.href = theme ? `/themes/${theme}.css` : "";
+ link.href = "/themes/" + (theme ? `${theme}.css` : "default.css");
}
}
diff --git a/content.css b/content.css
index b8d2e17..7ae8842 100644
--- a/content.css
+++ b/content.css
@@ -1,4 +1,4 @@
-/* LeechBlock content CSS style */
+/* LeechBlock content overlay style */
.leechblock-timer {
z-index: 2147483647;
diff --git a/options.css b/options.css
index 55ddcd5..7f182ad 100644
--- a/options.css
+++ b/options.css
@@ -1,4 +1,4 @@
-/* LeechBlock options CSS style */
+/* LeechBlock options style */
html {
overflow-y: scroll;
diff --git a/options.html b/options.html
index 3a0745f..bfa3dc1 100644
--- a/options.html
+++ b/options.html
@@ -407,6 +407,7 @@
diff --git a/popup.css b/popup.css
index 781902e..a75974f 100644
--- a/popup.css
+++ b/popup.css
@@ -1,4 +1,4 @@
-/* LeechBlock popup CSS style */
+/* LeechBlock popup style */
body {
background-color: #fff;
diff --git a/popup.js b/popup.js
index 1cce9d5..528a497 100644
--- a/popup.js
+++ b/popup.js
@@ -19,7 +19,7 @@ function initializePage() {
let theme = options["theme"];
let link = document.getElementById("themeLink");
if (link) {
- link.href = theme ? `/themes/${theme}.css` : "";
+ link.href = "/themes/" + (theme ? `${theme}.css` : "default.css");
}
}
}
diff --git a/style.css b/style.css
index bafb159..f1b5fbb 100644
--- a/style.css
+++ b/style.css
@@ -1,4 +1,4 @@
-/* LeechBlock CSS style */
+/* LeechBlock blocking/delaying page style */
body {
background: #fff;
diff --git a/themes/dark.css b/themes/dark.css
index 472f7be..d5f7ab1 100644
--- a/themes/dark.css
+++ b/themes/dark.css
@@ -1,4 +1,4 @@
-/* LeechBlock Dark theme CSS style */
+/* LeechBlock Dark theme style */
body {
background: #222;
diff --git a/themes/default.css b/themes/default.css
new file mode 100644
index 0000000..5ba149d
--- /dev/null
+++ b/themes/default.css
@@ -0,0 +1,114 @@
+/* LeechBlock Default theme style */
+
+@media (prefers-color-scheme: dark) {
+
+/* The following should replicate the Dark theme style */
+
+body {
+ background: #222;
+ color: #bbb;
+}
+
+.ui-button {
+ background: #444;
+ color: #bbb;
+ border: 1px solid #666;
+}
+
+.ui-button:focus {
+ background: #444;
+ color: #bbb;
+ border: 1px solid #666;
+}
+
+.ui-button:hover {
+ background: #333;
+ color: #bbb;
+ border: 1px solid #666;
+}
+
+.ui-widget button {
+ background: #444;
+ color: #bbb;
+ border: 1px solid #666;
+}
+
+.ui-widget button:hover:enabled {
+ background: #333;
+}
+
+.ui-widget button:disabled {
+ background: #333;
+ color: #666;
+ border: 1px solid #444;
+}
+
+.ui-widget fieldset, .ui-widget input, .ui-widget select, .ui-widget textarea {
+ background: #222;
+ color: #bbb;
+ border: 1px solid #666;
+}
+
+.ui-widget input:disabled, .ui-widget select:disabled, .ui-widget textarea:disabled {
+ background: #333;
+ color: #666;
+ border: 1px solid #444;
+}
+
+.ui-widget hr {
+ height: 0px;
+ margin: 0px;
+ border-top: none;
+ border-left: none;
+ border-right: none;
+ border-bottom: 1px solid #666;
+}
+
+.ui-widget th, td {
+ border: 1px solid #666;
+}
+
+.ui-widget-header {
+ background: #444;
+ color: #bbb;
+ border: 1px solid #888;
+}
+
+.ui-widget-content {
+ background: #222;
+ color: #bbb;
+ border: 1px solid #888;
+}
+
+.ui-widget.ui-widget-content {
+ border: 1px solid #888;
+}
+
+.ui-tabs .ui-state-default {
+ background: #aaa;
+ border: 1px solid #666;
+}
+
+.ui-tabs .ui-state-default a {
+ color: #000;
+}
+
+.ui-tabs .ui-state-hover {
+ background: #999;
+ border: 1px solid #666;
+}
+
+.ui-tabs .ui-state-active {
+ background: #222;
+ border: 1px solid #666;
+}
+
+.ui-tabs .ui-state-active a {
+ color: #bbb;
+}
+
+#paneAbout {
+ color: #bbb;
+}
+
+}
diff --git a/themes/light.css b/themes/light.css
new file mode 100644
index 0000000..a609b74
--- /dev/null
+++ b/themes/light.css
@@ -0,0 +1 @@
+/* LeechBlock Light theme style */
diff --git a/themes/spruce.css b/themes/spruce.css
index 3393468..ee428db 100644
--- a/themes/spruce.css
+++ b/themes/spruce.css
@@ -1,4 +1,4 @@
-/* LeechBlock Spruce theme CSS style */
+/* LeechBlock Spruce theme style */
body {
background: #031;