Fix quirks with the add-contact dropdown

converse.css

@@ -240,7 +240,6 @@ a.subscribe-to-user {
 
 dl.add-converse-contact {
     margin: 0 0 0 0.5em;
-    padding-top: 3px;
     z-index: 21;
     background: url('images/add_icon.png') no-repeat 3px;
 }
@@ -249,6 +248,11 @@ dt#xmpp-contact-search {
     padding-top: 3px;
 }
 
+.fancy-dropdown {
+    border:1px solid #ddd;
+    height: 22px;
+}
+
 .fancy-dropdown a.choose-xmpp-status,
 .fancy-dropdown a.toggle-xmpp-contact-form {
     text-shadow: 0 1px 0 rgba(250, 250, 250, 1);
@@ -631,12 +635,7 @@ form.add-xmpp-contact {
 }
 
 form.add-xmpp-contact input {
-    width: 130px;
-}
-
-.fancy-dropdown {
-    border:1px solid #ddd;
-    height: 22px;
+    width: 125px;
 }
 
 .dropdown dt a span {

converse.js

@@ -595,8 +595,7 @@
                 '<dt id="xmpp-contact-search" class="fancy-dropdown">' +
                     '<a class="toggle-xmpp-contact-form" href="#" title="Click to add new chat contacts">Add a contact</a>' +
                 '</dt>' +
-                '<dd class="search-xmpp" style="display:none"><ul>' +
-                '</ul></dd>' +
+                '<dd class="search-xmpp" style="display:none"><ul></ul></dd>' +
             '</dl>'
         ),
 
@@ -622,13 +621,17 @@
             } else {
                 markup = this.add_contact_template();
             }
-            this.$el.find('#xmpp-contact-search').siblings('.search-xmpp').append(markup);
+            this.$el.find('.search-xmpp ul').append(markup);
             return this;
         },
 
         toggleContactForm: function (ev) {
             ev.preventDefault();
-            this.$el.find('.search-xmpp').toggle().find('input.username').focus();
+            this.$el.find('.search-xmpp').toggle('fast', function () {
+                if ($(this).is(':visible')) {
+                    $(this).find('input.username').focus();
+                }
+            });
         },
 
         searchContacts: function (ev) {
@@ -637,7 +640,7 @@
                 var $results_el = $('#found-users');
                 $(data).each(function (idx, obj) {
                     if ($results_el.children().length) {
-                    $results_el.empty();
+                        $results_el.empty();
                     }
                     $results_el.append(
                         $('<li></li>')