From db592c0dfdb3437b7bc8cf6e23db675d9e6a9048 Mon Sep 17 00:00:00 2001
From: gaelle morin <gmorin.dev@gmail.com>
Date: Tue, 2 Jun 2020 19:03:31 +0200
Subject: [PATCH] update: left-menu - hover (need refactoring)

---
 src/styles/base/menu-left.scss | 95 ++++++++++++++++++++++------------
 1 file changed, 63 insertions(+), 32 deletions(-)

diff --git a/src/styles/base/menu-left.scss b/src/styles/base/menu-left.scss
index a821691..958ecbf 100644
--- a/src/styles/base/menu-left.scss
+++ b/src/styles/base/menu-left.scss
@@ -1,33 +1,3 @@
-#main__menu sib-router .sub-menu.menu-notification>sib-display>div>sib-display>div>hubl-menu-fix-url-project>sib-display>div:hover {
-  background-color: black;
-  color: cornflowerblue;
-  display: block;
-  padding: 0;
-
-
-  >hubl-menu-publicprivate {
-    display: none;
-  }
-
-  >hubl-counter {
-    display: none;
-  }
-
-  sib-set-default[name='project'] .project-name {
-    padding-left: 0;
-  
-    &>div {
-      overflow: visible;
-    }
-  }
-
-  
-  project-customer {
-    overflow: visible;
-  }
-
-}
-
 #main__menu {
   background-color: var(--color-menu-background);
   color: var(--color-menu-text);
@@ -137,13 +107,11 @@
           }
 
           .project-customer {
-            font-weight: bold;
             width: 150px;
           }
 
           .project-name {
             display: block;
-            padding-left: 14px;
             width: calc(150px - 10px);
             /* 10px = padding of the sib-set-default = better alignment */
           }
@@ -247,6 +215,7 @@
             display: flex;
             sib-display-div {
               flex: 3;
+              max-width: 150px;
             }
             hubl-counter {
               height: 20px;
@@ -265,6 +234,16 @@
                 color: var(--color-secondary);
               }
             }
+
+            sib-display-div {
+              max-width: 150px;
+
+              >div[name="name"] {
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+              }
+            }
           }
         }
       }
@@ -277,6 +256,58 @@
   }
 }
 
+#main__menu sib-router .sub-menu.menu-notification>sib-display>div>sib-display>div>hubl-menu-fix-url-project>sib-display>div:hover,
+#main__menu sib-router .sub-menu.menu-notification>sib-display>div>sib-display>div>hubl-menu-fix-url-circle>sib-display>div:hover,
+#main__menu sib-router .sub-menu.menu-notification>sib-display.nosub>div>sib-display>div:hover {
+  background-color: #46271B;
+  color: #ffffff;
+  display: block;
+  box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.26);
+  opacity: 70%;
+  width: 250px;
+  box-sizing: border-box;
+  font-weight: normal;
+
+
+  >hubl-menu-publicprivate {
+    display: none;
+  }
+
+  >hubl-counter {
+    display: none;
+  }
+
+  sib-set-default[name='project']>.project-name {
+    padding-left: 0;
+    width: 100%;
+  
+    &>div {
+      white-space: break-spaces;
+      text-align: left;
+    }
+  }
+
+  
+  >sib-set-default[name='project']>.project-customer {
+    width: 250px;
+    white-space: break-spaces;
+    text-align: left;
+    font-weight: normal;
+  }
+
+  >sib-display-div[name="name"] {
+    padding-left: 0;
+    width: 100%;
+  }
+
+  sib-display-div {
+
+    >div[name="name"] {
+      white-space: normal;
+    }
+  }
+}
+
 // Temporary fix for badges
 sib-fix-badge {
   display: none;