display handle for search bar

fix margin and color

hidden overflow for long handle and names

	modified:   app/assets/javascripts/widgets/search.js
	modified:   app/assets/stylesheets/autocomplete.css.scss

add min width 300px

	modified:   app/assets/javascripts/widgets/search.js
	modified:   app/assets/stylesheets/autocomplete.css.scss

app/assets/javascripts/widgets/search.js

@@ -10,6 +10,7 @@
         searchFormAction: searchForm.attr("action"),
         searchInput: searchForm.find("input[type='search']"),
         searchInputName: searchForm.find("input[type='search']").attr("name"),
+        searchInputHandle: searchForm.find("input[type='search']").attr("handle"),
         options: {
           cacheLength : 15,
           delay : 800,
@@ -34,9 +35,9 @@
         return Diaspora.I18n.t("search_for", row);
       } else {
 				if (row.avatar) {        
-					return "<img src='"+ row.avatar +"' class='avatar'/>" + row.name;
+					return "<img src='"+ row.avatar +"' class='avatar'/>" + row.name + "<div class='search_handle'>" + row.handle + "</div>";
 				} else {
-					return row.name;				
+					return row.name + "<div class='search_handle'>" + row.handle + "</div>";				
 				}
       }
     };

app/assets/stylesheets/autocomplete.css.scss

@@ -3,7 +3,7 @@
   background-color: transparent;
   overflow: hidden;
   z-index: 99999;
-  min-width: 247px !important;
+  min-width: 300px !important;
   width: 100%;
 
   -webkit-border-radius: 3px;
@@ -42,6 +42,8 @@
   // in relative units scroll will be broken in firefox
   //:line-height 16px
   overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
 }
 
 .ac_loading {
@@ -71,4 +73,20 @@
     left: 5px;
     top: 5px;
   }
+
+  .search_handle {
+    font-size: 0.8em;
+    color: #999;
+    margin-top: -3px;
+  }
+
+  .ac_over .search_handle{
+    color: #fff;
+  }
+
+  .ac_over .search_handle, .search_handle {
+    display: block;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
 }