Improve styling of widget search field

Fixes #83

Author: shaunandrews

widget-customizer.css

@@ -384,58 +384,39 @@ body.adding-widget .add-new-widget:before {
 overflow: auto;
 top: 0;
 bottom: 0;
-left: -300px;
+left: -301px;
 width: 300px;
 margin: 0;
-padding-bottom: 46px;
 z-index: 1;
 background: #fff;
 -webkit-transition: all 0.2s;
 transition: all 0.2s;
--webkit-box-shadow: inset -1px 0 4px rgba(0,0,0,0.3);
-box-shadow: inset -1px 0 4px rgba(0,0,0,0.3);
+border-right: 1px solid #dddddd;
 }
 
 #available-widgets-filter {
-display: none;
-position: fixed;
-right: 0;
-bottom: 0;
-left: 300px;
-width: 300px;
-padding: 8px 20px;
-background: #fafafa;
-background: rgba(255,255,255,0.95);
-border-top: 1px solid rgba(0,0,0,0.1);
-z-index: 2;
+padding: 8px 17px 7px 13px;
+border-bottom: 1px solid #e4e4e4;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 }
 
-.adding-widget #available-widgets-filter {
-display: block;
-}
-
 #available-widgets-filter input {
-padding: 5px 5px 2px 20px;
+padding: 5px 10px 2px 10px;
 width: 100%;
-border-radius: 30px;
 }
 
 #available-widgets .widget-tpl {
 position: relative;
 padding: 20px 15px 20px 60px;
--webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.05);
-box-shadow: inset 0 -1px 0 rgba(0,0,0,.05);
+border-bottom: 1px solid #e4e4e4;
 cursor: pointer;
 }
 
 #available-widgets .widget-tpl:hover,
 #available-widgets .widget-tpl.selected {
 background: #fafafa;
--webkit-box-shadow: inset -4px 0 4px -4px rgba(0,0,0,0.3), inset 3px 0 4px -4px rgba(0,0,0,0.3), inset 0 -1px 0 rgba(0,0,0,.07);
-box-shadow: inset -4px 0 4px -4px rgba(0,0,0,0.3), inset 3px 0 4px -4px rgba(0,0,0,0.3), inset 0 -1px 0 rgba(0,0,0,.07);
 }
 
 #available-widgets .widget-top,