move peer button colors into separate variables

sni · Jun 12, 2023 · 0b19720 · 0b19720
1 parent 30203af
commit 0b19720
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 9 deletions.
diff --git a/themes/base.css b/themes/base.css
@@ -78,11 +78,13 @@
   --console-bg:               var(--color-black);
 
   --peer-up-bg:               var(--color-green-500);
-  --peer-up-fg:               var(--color-white);
+  --peer-up-fg:               var(--color-gray-700);
+  --peer-down-bg:             var(--color-red-500);
+  --peer-down-fg:             var(--color-gray-700);
   --peer-dis-bg:              var(--color-truegray-300);
-  --peer-dis-fg:              var(--color-white);
+  --peer-dis-fg:              var(--color-gray-700);
   --peer-hid-bg:              var(--color-truegray-200);
-  --peer-hid-fg:              var(--color-white);
+  --peer-hid-fg:              var(--color-gray-500);
 
   --progessbar-fg:            var(--color-sky-500);
   --progessbar-bg:            var(--color-gray-200);
@@ -200,7 +202,7 @@
   .UNKNOWN {
     @apply !bg-[color:var(--badge-unknown-bg)] !text-[color:var(--badge-unknown-fg)];
   }
-  .CRITICAL, .NO, .DISABLED, .button_peerDOWN {
+  .CRITICAL, .NO, .DISABLED {
     @apply !bg-[color:var(--badge-critical-bg)] !text-[color:var(--badge-critical-fg)];
   }
 
@@ -228,6 +230,9 @@
   .button_peerUP {
     @apply !bg-[color:var(--peer-up-bg)] !text-[color:var(--peer-up-fg)];
   }
+  .button_peerDOWN {
+    @apply !bg-[color:var(--peer-down-bg)] !text-[color:var(--peer-down-fg)];
+  }
   .button_peerDIS {
     @apply !bg-[color:var(--peer-dis-bg)] !text-[color:var(--peer-dis-fg)];
   }
@@ -1324,7 +1329,7 @@ DIV.spinner {
  * site panel / backends
  */
 #site_panel .button_peer, div.backends BUTTON, #site_panel .btn_sites {
-  @apply px-0.5 w-24 block truncate h-max !text-[color:var(--button-fg)] hover:!text-[color:var(--button-hover-fg)] hover:brightness-90;
+  @apply px-0.5 w-24 block truncate h-max hover:!text-[color:var(--button-hover-fg)] hover:brightness-90;
 }
 UL.ui-fancytree {
   IMG {

diff --git a/themes/themes-available/Dark/src/Dark.css b/themes/themes-available/Dark/src/Dark.css
@@ -75,11 +75,13 @@
   --console-bg:               var(--color-black);
 
   --peer-up-bg:               var(--color-green-600);
-  --peer-up-fg:               var(--text-body);
+  --peer-up-fg:               #f2f2f2;
+  --peer-down-bg:             var(--color-red-700);
+  --peer-down-fg:             #f2f2f2;
   --peer-dis-bg:              #777;
-  --peer-dis-fg:              var(--text-body);
-  --peer-hid-bg:              var(--color-truegray-200);
-  --peer-hid-fg:              var(--text-body);
+  --peer-dis-fg:              #f2f2f2;
+  --peer-hid-bg:              #666;
+  --peer-hid-fg:              #f2f2f2;
 
   --progessbar-fg:            var(--color-sky-800);
   --progessbar-bg:            var(--color-warmgray-500);