CSS tweaks to link styles for sidebar, nav bar, search pane. Also the nav bar height seemed off from the sidebar, so made that consistent. Variables were created when colors were hard-coded for both dark and light. This meant that both variables.light.less and variables.dark.less were updated.

src/css/less/navbar.less

@@ -3,7 +3,7 @@
 }
 
 .navbar .nav>li>a {
-  padding: 17px 15px 11px;
+  padding: 17px 15px 13px;
   .fa { font-size: 115%; }
 }
 
@@ -20,8 +20,9 @@
 }
 
 .top-nav-menu-btn {
+  border: 1px solid @bodyBackground;
   border-radius: 50%;
-  background: black;
+  background: @iconContainerBackground;
   display: block;
   position: relative;
   float: left;
@@ -64,7 +65,7 @@
   font-size: 1.4em;
   font-weight: bold;
   color: #a2a2a2;
-  border: 1px solid #555;
+  border: @grafanaTriggerBorder;
   a {
     display: inline-block;
     background: @grafanaTargetFuncBackground;

src/css/less/panel.less

@@ -13,7 +13,7 @@
 .panel-container {
   background: @grafanaPanelBackground;
   position: relative;
-  border: 1px solid @grayDark;
+  border: @grafanaPanelBorder;
   &:hover {
     .panel-actions {
       display: block;

src/css/less/sidemenu.less

@@ -50,6 +50,10 @@
     font-size: 14px;
 
     .icon-circle {
+      border-radius: 50%;
+      background: @iconContainerBackground;
+      box-shadow: @iconContainerShadow;
+      border: @iconContainerBorder;
       width: 28px;
       height: 28px;
       i {
@@ -60,7 +64,7 @@
     }
 
     .sidemenu-item {
-      color: @textColor;
+      // color: @textColor;
       line-height: 28px;
     }
   }
@@ -88,10 +92,11 @@
   display: block;
   padding: 8px 0 4px 22px;
   background-color: @navbarBackground;
-  border-right: 3px solid black;
+  border-right: 3px solid @bodyBackground;
   img {
     border-radius: 50%;
-    background: black;
+    background: @iconContainerBackground;
+    border: 1px solid @bodyBackground;
     width: 30px;
     padding: 4px;
   }
@@ -99,14 +104,11 @@
     padding-right: 5px;
     padding-top: 5px;
     font-size: 170%;
-    color: @gray;
+    color: @textColor;
   }
 }
 
 .icon-circle {
-  border-radius: 50%;
-  background: #000;
-  box-shadow: 0 0 14px 2px rgba(255,255,255, 0.05);
   width: 40px;
   height: 40px;
   display: inline-block;
@@ -115,8 +117,8 @@
     opacity: .7;
     position: relative;
     left: 7px;
-    top: 2px;
+    top: 3px;
-    font-size: 125%;
+    font-size: 150%;
   }
 }
 
@@ -124,17 +126,18 @@
 }
 
 .sidemenu-item {
-  color: #f80;
+  color: @grayLight;
   line-height: 40px;
 	padding: 0px 10px 0px 20px;
 	display: block;
 
   .sidemenu-item-text {
     padding-left: 15px;
+    transition: color 100ms ease-out;
+
     &.no-icon {
       padding-left: 59px;
     }
   }
 }
 
-

src/css/less/variables.dark.less

@@ -27,7 +27,9 @@
 
 // grafana Variables
 // -------------------------
-@grafanaPanelBackground: @grayDarker;
+@grafanaPanelBackground: 	@grayDarker;
+@grafanaPanelBorder: 		solid 1px @grayDark;
+@grafanaTriggerBorder:		solid 1px #555;
 
 // Graphite Target Editor
 @grafanaTargetBorder:         @black;
@@ -128,6 +130,11 @@
 @btnInverseBackground:              @grayDark;
 @btnInverseBackgroundHighlight:     lighten(@grayDark, 5%);
 
+@iconContainerBackground:			@black;
+@iconContainerBackgroundHighlight:	lighten(@black, 5%);
+@iconContainerBorder:				0 0 14px 2px rgba(255,255,255, 0.05);
+@iconContainerShadow:				0 0 14px 2px rgba(255,255,255, 0.05);
+
 
 // Forms
 // -------------------------
@@ -202,10 +209,10 @@
 @navbarCollapseWidth:             979px;
 @navbarCollapseDesktopWidth:      @navbarCollapseWidth + 1;
 
-@navbarHeight:                    50px;
+@navbarHeight:                    52px;
 @navbarBackgroundHighlight:       @grayDarker;
 @navbarBackground:                @grayDarker;
-@navbarBorder:                    darken(@navbarBackground, 20%);
+@navbarBorder:                    none;
 
 @navbarText:                      @grayLight;
 @navbarLinkColor:                 @grayLight;

src/css/less/variables.light.less

@@ -32,7 +32,9 @@
 
 // grafana Variables
 // -------------------------
-@grafanaPanelBackground: @white;
+@grafanaPanelBackground: 	@white;
+@grafanaPanelBorder: 		solid 1px @grayLight;
+@grafanaTriggerBorder:		solid 1px @grayLight;
 
 // Submenu
 @submenuBackground:     rgb(218, 217, 217);
@@ -61,7 +63,7 @@
 // -------------------------
 @linkColor:             darken(@textColor, 20%);
 @linkColorDisabled:     lighten(@linkColor,30%);
-@linkColorHover:        @blue;
+@linkColorHover:        @gray;
 
 
 // Typography
@@ -97,11 +99,11 @@
 @borderRadiusSmall:     2px;
 
 // Lists
-@grafanaListBackground:  transparent;
+@grafanaListBackground:  	lighten(@grayLight,35%);
 @grafanaListAccent:         @grayLighter;
 @grafanaListBorderTop:      #eee;
 @grafanaListBorderBottom:   #efefef;
-@grafanaListHighlight:      @blue;
+@grafanaListHighlight:      lighten(@grayLight,20%);
 @grafanaListHighlightContrast: #ddd;
 @grafanaListMainLinkColor: @textColor;
 
@@ -142,6 +144,12 @@
 @btnInverseBackground:              lighten(@black, 5%);
 @btnInverseBackgroundHighlight:     darken(@black, 5%);
 
+@iconContainerBackground:			@white;
+@iconContainerBackgroundHighlight:	lighten(@white, 5%);
+@iconContainerBorder:				solid 1px rgba(0,0,0, 0.05);
+@iconContainerShadow:				0 0 14px 2px rgba(0,0,0, 0.05);
+
+
 
 // Forms
 // -------------------------
@@ -164,8 +172,8 @@
 @dropdownLinkColorHover:        @white;
 @dropdownLinkColorActive:       @white;
 
-@dropdownLinkBackgroundActive:  @blue;
+@dropdownLinkBackgroundActive:  lighten(@grayLight,20%);
-@dropdownLinkBackgroundHover:   @blue;
+@dropdownLinkBackgroundHover:   lighten(@grayLight,20%);
 
 
 
@@ -216,14 +224,14 @@
 @navbarCollapseWidth:             979px;
 @navbarCollapseDesktopWidth:      @navbarCollapseWidth + 1;
 
-@navbarHeight:                    50px;
+@navbarHeight:                    52px;
 @navbarBackgroundHighlight:       #f8f8f8;
 @navbarBackground:                #f8f8f8;
-@navbarBorder:                    darken(@navbarBackground, 6.5%);
+@navbarBorder:                    none;
 
 @navbarText:                      #666;
 @navbarLinkColor:                 #666;
-@navbarLinkColorHover:            @blue;
+@navbarLinkColorHover:            #333;
 @navbarLinkColorActive:           #555;
 @navbarLinkBackgroundHover:       transparent;
 @navbarLinkBackgroundActive:      darken(@navbarBackground, 6.5%);
@@ -286,7 +294,7 @@
 // Tooltips and popovers
 // -------------------------
 @tooltipColor:            #fff;
-@tooltipBackground:       #000;
+@tooltipBackground:       #333;
 @tooltipArrowWidth:       5px;
 @tooltipArrowColor:       @tooltipBackground;
 @tooltipLinkColor:        darken(@white,11%);