From a359dc5e88b4ae58012bd10bef71fabe21fb676c Mon Sep 17 00:00:00 2001
From: JC Brand <jc@opkode.com>
Date: Thu, 5 Mar 2015 20:47:43 +0100
Subject: [PATCH] Add a drop-shadow for the user search box and fix widths.

---
 css/converse.css   | 10 ++++++----
 sass/converse.scss | 12 ++++++++----
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/css/converse.css b/css/converse.css
index ba727fa1d..b1f962b08 100644
--- a/css/converse.css
+++ b/css/converse.css
@@ -694,10 +694,10 @@
       border: 1px solid #999;
       font-size: 14px;
       height: 25px;
-      margin: 0 0 0.5em 6px;
+      margin: 0 0 0.5em 7px;
       padding: 0;
       padding: 2px;
-      width: 104px; }
+      width: 103px; }
     #conversejs #converse-roster .roster-filter.x {
       background-position: right 3px center; }
     #conversejs #converse-roster .roster-filter.onX {
@@ -850,8 +850,10 @@
       background-color: #F1E2DD; }
       #conversejs .chatbox .dropdown dd ul li:hover {
         background-color: #E3C9C1; }
-    #conversejs .chatbox .dropdown dd.search-xmpp ul li:hover {
-      background-color: #F1E2DD; }
+    #conversejs .chatbox .dropdown dd.search-xmpp ul {
+      box-shadow: 1px 4px 10px 1px rgba(0, 0, 0, 0.4); }
+      #conversejs .chatbox .dropdown dd.search-xmpp ul li:hover {
+        background-color: #F1E2DD; }
     #conversejs .chatbox .dropdown dt a span {
       cursor: pointer;
       display: block;
diff --git a/sass/converse.scss b/sass/converse.scss
index 48b46eae5..7a469f0f9 100644
--- a/sass/converse.scss
+++ b/sass/converse.scss
@@ -735,10 +735,10 @@
       border: 1px solid #999;
       font-size: $font-size;
       height: $controlbox-dropdown-height;
-      margin: 0 0 0.5em 6px;
+      margin: 0 0 0.5em 7px;
       padding: 0;
       padding: 2px;
-      width: 104px;
+      width: 103px;
     }
     /* (jQ addClass:) if input has value: */
     .roster-filter.x {
@@ -953,8 +953,12 @@
           }
         }
       }
-      dd.search-xmpp ul li:hover {
-        background-color: $light-background-color;
+      dd.search-xmpp ul {
+        box-shadow: 1px 4px 10px 1px rgba(0, 0, 0, 0.4);
+
+        li:hover {
+            background-color: $light-background-color;
+        }
       }
       dt a span {
         cursor: pointer;