From 20a406e820bbef7d95e57ef9e9bc54698ade10de Mon Sep 17 00:00:00 2001
From: Florian Strohmaier <florian.strohmaier@icinga.com>
Date: Wed, 19 Jan 2022 15:15:31 +0100
Subject: [PATCH] CSS: Improve theme mode compatibility

---
 public/css/module.less | 38 ++++++++++++++++++++------------------
 1 file changed, 20 insertions(+), 18 deletions(-)

diff --git a/public/css/module.less b/public/css/module.less
index 754787e..cda7665 100644
--- a/public/css/module.less
+++ b/public/css/module.less
@@ -24,11 +24,11 @@
   text-decoration: none;
   width: 100%;
   height: 100%;
-  color: #999;
+  color: @text-color;
   outline: none;
 }
 
-.module-grafana, .grafana-menu-navigation a:hover { color: #777; }
+.module-grafana, .grafana-menu-navigation a:hover { color: @text-color-light; }
 
 .grafana-table {
   border-spacing: 0px;
@@ -37,6 +37,11 @@
 
 .grafana-table i.icon-clock {
   font-size: 2em;
+  color: @icinga-blue;
+
+  &:hover {
+    opacity: .6;
+  }
 }
 
 .grafana-table td {
@@ -47,10 +52,9 @@
 .grafana-menu-navigation {
   list-style: none;
   padding: 0;
-  width: 100px; 
-  height: 30px; 
+  width: 100px;
+  height: 30px;
   margin: 0px;
-  background: #FFF;
 }
 
 .grafana-menu-navigation, .grafana-menu-navigation a.main {
@@ -66,11 +70,11 @@
 }
 
 .grafana-menu-navigation a.main {
-  display: block; 
+  display: block;
   height: 30px;
-  font: normal 15px/30px arial, sans-serif; 
-  text-align: center; 
-  text-decoration: none; 
+  font: normal 15px/30px arial, sans-serif;
+  text-align: center;
+  text-decoration: none;
   color: @icinga-blue;
   -webkit-transition: 0.3s ease-in-out;
   -o-transition: 0.3s ease-in-out;
@@ -82,12 +86,10 @@
   background-color: @icinga-blue;
 }
 
-.grafana-menu-navigation li { 
-  width: 100px; 
+.grafana-menu-navigation li {
+  width: 100px;
   height: 30px;
-  background: #F7F7F7;
-  font: normal 12px/30px arial, sans-serif !important; 
-  color: #999;
+  font: normal 12px/30px arial, sans-serif !important;
   text-align: center;
   margin: 0;
   -webkit-transform-origin: 50% 0%;
@@ -101,10 +103,10 @@
   -moz-box-shadow: 0px 2px 10px rgba(0,0,0,0.05);
 }
 
-.grafana-menu-navigation li:nth-child(even) { background: #F5F5F5; }
-.grafana-menu-navigation li:nth-child(odd) { background: #EFEFEF; }
+.grafana-menu-navigation li:nth-child(even) { background: @gray-light; }
+.grafana-menu-navigation li:nth-child(odd) { background: @gray-lighter; }
 
-.grafana-menu-navigation li.n1 { 
+.grafana-menu-navigation li.n1 {
   -webkit-transition: 0.2s linear 0.8s;
   -o-transition: 0.2s linear 0.8s;
   transition: 0.2s linear 0.8s;
@@ -119,7 +121,7 @@
   -o-transition: 0.2s linear 0.4s;
   transition: 0.2s linear 0.4s;
 }
-.grafana-menu-navigation li.n4 { 
+.grafana-menu-navigation li.n4 {
   -webkit-transition:0.2s linear 0.2s;
   -o-transition:0.2s linear 0.2s;
   transition:0.2s linear 0.2s;