From b9102b21e9a33035841ff8ac65f4c3fdc60c1244 Mon Sep 17 00:00:00 2001
From: Jennifer Mourek <jennifer.mourek@icinga.com>
Date: Tue, 26 Jun 2018 16:54:19 +0200
Subject: [PATCH] Calculate text-shadow to reduce the colour noise

---
 public/css/module.less | 31 +++++++++++++++----------------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/public/css/module.less b/public/css/module.less
index 93381c0..98aed9d 100644
--- a/public/css/module.less
+++ b/public/css/module.less
@@ -443,7 +443,6 @@ div.bp .badges {
         padding: 1em;
         font-weight: bold;
         word-wrap: break-word;
-        text-shadow: 0 0 1px @text-color;
         color: @text-color-inverted;
         top: 50%;
         -ms-transform: translateY(-50%);
@@ -503,21 +502,21 @@ div.bp .badges {
 }
 
 .tiles {
-    > .critical            { background-color: @colorCritical;}
-    > .critical.handled    { background-color: @colorCriticalHandled; }
-    > .down                { background-color: @colorCritical; }
-    > .down.handled        { background-color: @colorCriticalHandled; }
-    > .unknown             { background-color: @colorUnknown; }
-    > .unknown.handled     { background-color: @colorUnknownHandled; }
-    > .unreachable         { background-color: @colorUnknown; }
-    > .unreachable.handled { background-color: @colorUnknownHandled; }
-    > .warning             { background-color: @colorWarning; }
-    > .warning.handled     { background-color: @colorWarningHandled; }
-    > .ok                  { background-color: @colorOk; }
-    > .up                  { background-color: @colorOk; }
-    > .pending             { background-color: @colorPending; }
-    > .missing             { background-color: @gray-light; }
-    > .addnew              { background-color: @icinga-blue; }
+    > .critical            { background-color: @colorCritical;          > a { text-shadow: 0 0 1px mix(#000, @colorCritical, 40%); }}
+    > .critical.handled    { background-color: @colorCriticalHandled;   > a { text-shadow: 0 0 1px mix(#000, @colorCriticalHandled, 40%); }}
+    > .down                { background-color: @colorCritical;          > a { text-shadow: 0 0 1px mix(#000, @colorCritical, 40%); }}
+    > .down.handled        { background-color: @colorCriticalHandled;   > a { text-shadow: 0 0 1px mix(#000, @colorCriticalHandled, 40%); }}
+    > .unknown             { background-color: @colorUnknown;           > a { text-shadow: 0 0 1px mix(#000, @colorUnknown, 40%); }}
+    > .unknown.handled     { background-color: @colorUnknownHandled;    > a { text-shadow: 0 0 1px mix(#000, @colorUnknownHandled, 40%); }}
+    > .unreachable         { background-color: @colorUnknown;           > a { text-shadow: 0 0 1px mix(#000, @colorUnknown, 40%); }}
+    > .unreachable.handled { background-color: @colorUnknownHandled;    > a { text-shadow: 0 0 1px mix(#000, @colorUnknownHandled, 40%); }}
+    > .warning             { background-color: @colorWarning;           > a { text-shadow: 0 0 1px mix(#000, @colorWarning, 40%); }}
+    > .warning.handled     { background-color: @colorWarningHandled;    > a { text-shadow: 0 0 1px mix(#000, @colorWarningHandled, 40%); }}
+    > .ok                  { background-color: @colorOk;                > a { text-shadow: 0 0 1px mix(#000, @colorOk, 40%); }}
+    > .up                  { background-color: @colorOk;                > a { text-shadow: 0 0 1px mix(#000, @colorOk, 40%); }}
+    > .pending             { background-color: @colorPending;           > a { text-shadow: 0 0 1px mix(#000, @colorPending, 40%); }}
+    > .missing             { background-color: @gray-light;             > a { text-shadow: 0 0 1px @gray }}
+    > .addnew              { background-color: @icinga-blue;            > a { text-shadow: 0 0 1px mix(#000, @icinga-blue, 40%); }}
 }
 
 /*