feat(sidenav): more polish to new sidenamv

public/app/features/sidemenu/sidemenu.ts

@@ -22,7 +22,9 @@ class SideMenuCtrl {
     this.appSubUrl = config.appSubUrl;
     this.showSignout = this.contextSrv.isSignedIn && !config['authProxyEnabled'];
     this.updateMenu();
-    this.$scope.$on('$routeChangeSuccess', () => this.updateMenu());
+    this.$scope.$on('$routeChangeSuccess', () => {
+      this.contextSrv.sidemenu = false;
+    });
   }
 
  getUrl(url) {
@@ -64,8 +66,8 @@ class SideMenuCtrl {
 
    this.orgMenu.push({cssClass: "divider"});
 
-   if (config.allowOrgCreate) {
-     this.orgMenu.push({text: "New organization", icon: "fa fa-fw fa-plus", url: this.getUrl('/org/new')});
+   if (this.contextSrv.isGrafanaAdmin) {
+     this.orgMenu.push({text: "Grafana adminstration", icon: "fa fa-fw fa-cogs", url: this.getUrl("/admin/settings")});
    }
 
    this.backendSrv.get('/api/user/orgs').then(orgs => {
@@ -81,13 +83,11 @@ class SideMenuCtrl {
            this.switchOrg(org.orgId);
          }
        });
-     });
-
-     this.orgMenu.push({cssClass: "divider"});
 
-     if (this.contextSrv.isGrafanaAdmin) {
-       this.orgMenu.push({text: "Server admin", url: this.getUrl("/admin/settings")});
-     }
+       if (config.allowOrgCreate) {
+         this.orgMenu.push({text: "New organization", icon: "fa fa-fw fa-plus", url: this.getUrl('/org/new')});
+       }
+     });
    });
  }
 
@@ -104,19 +104,19 @@ class SideMenuCtrl {
    this.mainLinks.push({
      text: "System info",
      icon: "fa fa-fw fa-info",
-     href: this.getUrl("/admin/settings"),
+     url: this.getUrl("/admin/settings"),
    });
 
    this.mainLinks.push({
      text: "Global Users",
      icon: "fa fa-fw fa-user",
-     href: this.getUrl("/admin/users"),
+     url: this.getUrl("/admin/users"),
    });
 
    this.mainLinks.push({
      text: "Global Orgs",
      icon: "fa fa-fw fa-users",
-     href: this.getUrl("/admin/orgs"),
+     url: this.getUrl("/admin/orgs"),
    });
  }
 

public/less/navbar.less

@@ -69,7 +69,7 @@
 
 .top-nav-dashboards-btn {
   a {
-    padding: 14px 17px 14px 13px;
+    padding: 15px 17px 14px 13px;
   }
 
   .fa-th-large {

public/less/search.less

@@ -1,6 +1,6 @@
 .search-container {
-  left: 52px;
-  top: 33px;
+  left: 59px;
+  top: 39px;
   margin: 15px;
   z-index: 1000;
   position: absolute;

public/less/sidemenu.less

@@ -82,7 +82,7 @@
 
 .sidemenu-item {
   color: @linkColor;
-  line-height: 45px;
+  line-height: 47px;
   padding: 0px 10px 0px 20px;
   display: block;
   white-space: nowrap;
@@ -162,26 +162,24 @@
   }
 }
 
-.sidemenu-org-section {
-  box-shadow: @sideMenuTopShadow;
+.sidemenu-org {
   border-bottom: @sideMenuBorder;
+  box-shadow: @sideMenuTopShadow;
   padding: 17px 10px 15px 21px;
+  box-sizing: border-box;
   cursor: pointer;
   &:hover {
     background-color: @grafanaTargetFuncBackground;
   }
-}
-
-.sidemenu-org {
   display: table;
   position: relative;
-  width: 159px;
+  width: 100%;
 }
 
 .sidemenu-org .fa-caret-right {
   position: absolute;
-  top: 17px;
-  right: -12px;
+  top: 50%;
+  right: 4px;
   font-size: 80%;
   color: @linkColor;
 }
@@ -204,7 +202,7 @@
 }
 
 .sidemenu-org-details {
-  padding-left: 16px;
+  padding-left: 10px;
   color: @linkColor;
 }