added fade transition for logo icon to hamburger

src/css/less/grafana.less

-@import "p_pro.less";
+@import "login.less";
 @import "submenu.less";
 @import "submenu.less";
 @import "graph.less";
 @import "graph.less";
 @import "bootstrap-tagsinput.less";
 @import "bootstrap-tagsinput.less";

src/css/less/navbar.less

@@ -22,29 +22,35 @@
   border-radius: 50%;
   border-radius: 50%;
   background: black;
   background: black;
   display: block;
   display: block;
+  position: relative;
   float: left;
   float: left;
+  width: 30px;
+  height: 30px;
   padding: 4px;
   padding: 4px;
   margin: 7px 6px 3px 9px;
   margin: 7px 6px 3px 9px;
   .fa {
   .fa {
-    display: none;
+    color: @textColor;
+    width: 30px;
+    height: 30px;
+    left: 10px;
+    top: 8px;
+    font-size: 150%;
+    opacity: 0;
+    position: absolute;
+    transition: opacity .25s ease-in-out;
   }
   }
   img {
   img {
     width: 30px;
     width: 30px;
+    position: absolute;
+    opacity: 1;
+    transition: opacity .25s ease-in-out;
   }
   }
   &:hover {
   &:hover {
     .fa {
     .fa {
-      display: block;
-      width: 30px;
-      height: 30px;
-      color: @textColor;
       opacity: .7;
       opacity: .7;
-      position: relative;
-      left: 6px;
-      top: 4px;
-      font-size: 150%;
     }
     }
     img {
     img {
-      display: none;
+      opacity: 0;
     }
     }
   }
   }
 }
 }