From 2b2f0cf48fafa74491b0c0631efb9f133e58d149 Mon Sep 17 00:00:00 2001
From: Florian Strohmaier <florian.strohmaier@icinga.com>
Date: Thu, 28 Nov 2019 14:55:43 +0100
Subject: [PATCH] menu.less: Align .badge-nav-item with flexbox

---
 public/css/icinga/menu.less | 49 +++++++++++++++++++++++++++++++++++--
 1 file changed, 47 insertions(+), 2 deletions(-)

diff --git a/public/css/icinga/menu.less b/public/css/icinga/menu.less
index 7a8a3258c..6fec4a93f 100644
--- a/public/css/icinga/menu.less
+++ b/public/css/icinga/menu.less
@@ -149,8 +149,8 @@ ul:not(.nav-level-2) > .selected > a {
     padding: 0.364em 0.545em 0.364em (@icon-width + .75em)/@font-size-small;
   }
 
-  &:not(.selected):not(.active) > a:hover,
-  &:not(.selected):not(.active) > a:focus {
+  &:not(.selected):not(.active) > a:not(.badge):hover,
+  &:not(.selected):not(.active) > a:not(.badge):focus {
     background-color: mix(#000, @menu-active-bg-color, 20);
     color: @menu-2ndlvl-highlight-color;
   }
@@ -479,3 +479,48 @@ input[type=text].search-input {
   width: 1.4em;
   margin-right: 0;
 }
+
+#layout:not(.sidebar-collapsed) #menu .nav-level-1 > .nav-item.active .nav-level-2 > li,
+#layout:not(.sidebar-collapsed) #menu .nav-level-1 > .nav-item:not(.active).hover .nav-level-2 > li {
+  &.badge-nav-item {
+    display: flex;
+    align-items: center;
+  }
+
+  &.badge-nav-item a:not(.badge) {
+    flex: 1 1 auto;
+    width: 0;
+  }
+
+  &.badge-nav-item a.badge {
+    color: white;
+    flex: 0 1 auto;
+    margin-right: 1em;
+    padding: .25em;
+    width: auto;
+
+    &:hover {
+      opacity: .6;
+    }
+  }
+}
+
+#layout:not(.sidebar-collapsed) #menu .nav-level-1 > .nav-item.active .nav-level-2 > li {
+  &.badge-nav-item:not(.selected) {
+    &:hover {
+      background-color: darken(@menu-bg-color, 20);
+
+      a {
+        color: white;
+      }
+    }
+  }
+}
+
+#layout:not(.sidebar-collapsed) #menu .nav-level-1 > .nav-item:not(.active).hover .nav-level-2 > li {
+  &.badge-nav-item {
+    &:hover {
+      background-color: lighten(@icinga-blue, 80);
+    }
+  }
+}