Use CSS properties to define colors for each theme

Signed-off-by: RD WebDesign <[email protected]>
pi-hole · Jan 24, 2025 · 6041fbc · 6041fbc
1 parent 6f93329
commit 6041fbc
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 4 deletions.
diff --git a/style/themes/default-dark.css b/style/themes/default-dark.css
@@ -11,6 +11,12 @@
 :root {
   --datatable-bgcolor: rgba(64, 76, 88, 0.8);
   --overlay-bgcolor: var(--datatable-bgcolor);
+
+  /* Dashboard graphic bars */
+  --allowed-color: #12b660;
+  --blocked-color: #822d21;
+  --cached-color: #44649C;
+  --other-color: #969798;
 }
 
 /* fix #2554: browser not detecting dark mode */

diff --git a/style/themes/default-darker.css b/style/themes/default-darker.css
@@ -110,6 +110,12 @@ select:-webkit-autofill {
   --darkreader-selection-text: #e8e6e3;
   --datatable-bgcolor: rgb(35, 47, 52);
   --overlay-bgcolor: rgba(35, 47, 52, 0.7);
+
+  /* Dashboard graphic bars */
+  --allowed-color: #12b660;
+  --blocked-color: #822d21;
+  --cached-color: #44649C;
+  --other-color: #969798;
 }
 
 /* Modified CSS */

diff --git a/style/themes/high-contrast-dark.css b/style/themes/high-contrast-dark.css
@@ -25,10 +25,11 @@
   --network-older: #182840;
   --network-never: #182028;
 
-  --allowed-color: var(--primary-color);
-  --blocked-color: var(--danger-color);
-  --cached-color: #a86600;
-  --other-color: #0077a6;
+  /* Dashboard graphic bars */
+  --allowed-color: #12b660;
+  --blocked-color: #822d21;
+  --cached-color: #44649C;
+  --other-color: #969798;
 
   --datatable-bgcolor: rgba(18, 44, 68, 0.3);
   --overlay-bgcolor: rgba(24, 28, 32, 0.8);

diff --git a/style/themes/lcars.css b/style/themes/lcars.css
@@ -11,6 +11,12 @@
   --net-old-color: #125;
   --net-older-color: #1c2228;
   --datatable-bgcolor: var(--net-old-color);
+
+  /* Dashboard graphic bars */
+  --allowed-color: #084;
+  --blocked-color: #c43;
+  --cached-color: #0ad;
+  --other-color: #fa3;
 }
 
 .sidebar-collapse {