ux(): clean / simplify markup and css for navbar button

public/sass/components/_dashboard.scss

@@ -58,7 +58,7 @@
 
 .row-open {
   margin-top: 5px;
-  left: -28px;
+  left: -30px;
   position: absolute;
   z-index: 100;
   transition: .10s left;

public/sass/components/_navbar.scss

@@ -56,52 +56,30 @@
   background-color: $navbarLinkBackgroundActive;
 }
 
-
-.fa.top-nav-breadcrumb-icon {
-  margin: 18px 0 6px 5px;
-  float: left;
-  font-size: 120%;
-  color: $text-color;
-}
-
-.top-nav-btn {
+.navbar-brand-btn {
   display: block;
   position: relative;
   float: left;
   margin: 0;
-  font-size: 1.4em;
   border-right: 1px solid $tight-form-border;
+  background-color: $navbarButtonBackground;
+  padding: 0.6rem 1.0rem 0.5rem 1rem;
 
   .fa-caret-down {
-    font-size: 55%;
-    position: absolute;
-    right: 8px;
-    top: 23px;
-    margin-right: 2px;
+    font-size: 70%;
   }
 
-  a {
-    color: darken($link-color, 5%);
-    background-color: $navbarButtonBackground;
-    display: inline-block;
-    &:hover {
-      background: $navbarButtonBackgroundHighlight;
-      color: $link-color;
-      // border-bottom: 1px solid $blue;
-    }
+  &:hover {
+    background: $navbarButtonBackgroundHighlight;
   }
-}
 
-.top-nav-menu-btn {
-  a {
-     padding: 7px 20px 6px 13px;
-  }
   img {
     width: 30px;
     position: relative;
     top: -2px;
   }
-  .top-nav-logo-background {
+
+  .navbar-brand-btn-background {
     display: inline-block;
     border: 1px solid $body-bg;
     padding: 4px;
@@ -110,6 +88,7 @@
     width: 40px;
     height: 40px;
   }
+
   .icon-gf-grafana_wordmark {
     font-size: 21px;
     position: relative;
@@ -119,13 +98,28 @@
   }
 }
 
-.dashnav-dashboards-btn {
-  a {
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-    display: block;
-    padding: 11px 17px 12px 13px;
+.navbar-page-btn {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  float: left;
+  display: block;
+  margin: 0;
+  font-size: 1.4em;
+  border-right: 1px solid $tight-form-border;
+  color: darken($link-color, 5%);
+  background-color: $navbarButtonBackground;
+  font-size: $font-size-lg;
+  padding: 1rem 0.8rem;
+
+  &:hover {
+    background: $navbarButtonBackgroundHighlight;
+    color: $link-color;
+  }
+
+  .fa-caret-down {
+    font-size: 60%;
+    padding-left: 0.2rem;
   }
 
   .fa-th-large {
@@ -141,32 +135,3 @@
   }
 }
 
-.dashboard-title {
-  padding: 0 0.4rem 0 0.5rem;
-  font-size: $font-size-lg;
-}
-
-.top-nav-icon {
-  margin: 5px 0px 0 11px;
-  line-height: 41px;
-  float: left;
-}
-
-.top-nav-section {
-  display: block;
-  float: left;
-  padding: 19px 9px 8px 0;
-  font-weight: bold;
-  i {
-    padding-left: 8px;
-  }
-}
-
-.top-nav-title {
-  display: block;
-  float: left;
-  font-size: 17px;
-  padding: 18px 10px 10px 13px;
-  color: $link-color;
-}
-

public/sass/components/_sidemenu.scss

@@ -30,16 +30,15 @@
     min-height: calc(100% - 54px);
   }
   .dashboard-container {
-    padding-left: $side-menu-width;
+    padding-left: $side-menu-width + 0.2rem;
   }
   .page-container {
     margin-left: $side-menu-width;
   }
-  .top-nav-menu-btn {
-    a {
-      background-color: $page-bg;
-      width: $side-menu-width;
-    }
+  .navbar-brand-btn {
+    background-color: $page-bg;
+    width: $side-menu-width;
+
     .icon-gf-grafana_wordmark  {
       display: inline-block;
     }
@@ -47,9 +46,6 @@
       display: none;
     }
   }
-  .sidemenu-org {
-    box-shadow: none;
-  }
   .search-container {
     left: auto;
   }
@@ -176,7 +172,7 @@
 .sidemenu .fa-caret-right {
   position: absolute;
   top: 38%;
-  right: 25px;
+  right: 6px;
   font-size: 14px;
   color: $link-color;
 }