UI improvements to search result list (larger click are for dashboard title link, plus UI look polish), Closes #709

src/css/less/grafana.less

@@ -35,9 +35,8 @@
 // Search
 
 .grafana-search-panel {
-  padding: 6px 10px;
-
   .search-field-wrapper {
+    padding: 6px 10px;
     input {
       width: 100%;
     }
@@ -50,25 +49,55 @@
       padding-right: 25px;
     }
   }
+}
 
-  .selected td, tr.selected:nth-child(odd)>td {
-    background: @blue;
-    color: white;
-    text-shadow: -1px -1px 1px rgba(0,0,0,0.3);
-    a {
-      color: white;
+.search-results-container {
+  .search-result-item a {
+  }
+
+  .search-result-item:hover, .search-result-item.selected {
+    .search-result-link, .icon {
+      color: @grafanaListHighlight;
+    }
+    .search-result-link .label {
+      background-color: @blue;
     }
   }
 
-  .selected-tag .label-tag {
-    background-color: @blue;
+
+  .search-result-link {
+    color: @grafanaListMainLinkColor;
+    .icon {
+      padding-right: 10px;
+      color: @grafanaListHighlightContrast;
+    }
+  }
+
+  .search-result-item:nth-child(odd) {
+    background-color: @grafanaListAccent;
+  }
+
+  .search-result-item {
+    padding: 6px 10px;
+    white-space: nowrap;
+    border-top: 1px solid @grafanaListBorderTop;
+    border-bottom: 1px solid @grafanaListBorderBottom;
+  }
+
+  .search-result-tags {
+    float: right;
+  }
+
+  .search-result-actions {
+    float: right;
+    padding-left: 10px;
   }
 }
 
 .search-tagview-switch {
   position: absolute;
   top: 15px;
-  right: 263px;
+  right: 266px;
   color: darken(@linkColor, 30%);
   &.active {
     color: @linkColor;

src/css/less/variables.dark.less

@@ -57,7 +57,7 @@
 
 // Links
 // -------------------------
-@linkColor:             darken(@white,5%);
+@linkColor:             darken(@white,11%);
 @linkColorHover:        @white;
 
 
@@ -93,6 +93,14 @@
 @borderRadiusLarge:     4px;
 @borderRadiusSmall:     2px;
 
+// Lists
+@grafanaListBackground:  transparent;
+@grafanaListAccent:         #232323;
+@grafanaListBorderTop:      #3E3E3E;
+@grafanaListBorderBottom:   #1c1919;
+@grafanaListHighlight:      @blue;
+@grafanaListHighlightContrast: #4F4F4F;
+@grafanaListMainLinkColor: @linkColor;
 
 // Tables
 // -------------------------

src/css/less/variables.light.less

@@ -20,7 +20,7 @@
 
 // Accent colors
 // -------------------------
-@blue:                  #01A6E6;
+@blue:                  #007FFF;
 @blueDark:              #75CAEB;
 @green:                 #28B62C;
 @red:                   #FF4136;
@@ -97,6 +97,15 @@
 @borderRadiusLarge:     4px;
 @borderRadiusSmall:     2px;
 
+// Lists
+@grafanaListBackground:  transparent;
+@grafanaListAccent:         #f9f9f9;
+@grafanaListBorderTop:      #eee;
+@grafanaListBorderBottom:   #efefef;
+@grafanaListHighlight:      @blue;
+@grafanaListHighlightContrast: #ddd;
+@grafanaListMainLinkColor: @textColor;
+
 
 // Tables
 // -------------------------