Tweak invite widget style and make the placeholder text translateable.

updates #215

converse.js

@@ -2056,7 +2056,8 @@
                     this.$el.find('.chat-body').empty().append(
                         converse.templates.chatarea({
                             'show_toolbar': converse.show_toolbar,
-                            'label_message': __('Message')
+                            'label_message': __('Message'),
+                            'label_invitation': __('Type to invite')
                         })
                     );
                     this.initInviteWidget().renderToolbar();

css/converse.css

@@ -606,9 +606,9 @@ span.spinner.hor_centered {
   font-size: 12px;
 }
 #conversejs .chatroom .invited-contact {
-  margin: 2px 1px 0 1px;
-  width: 96px;
-  border: 1px solid #999;
+  margin: 0;
+  width: 99px;
+  border-bottom: 1px solid #999;
 }
 #conversejs .participants ul.participant-list li {
   overflow: hidden;

less/converse.less

@@ -656,9 +656,9 @@ span.spinner.hor_centered {
 }
 
 #conversejs .chatroom .invited-contact {
-    margin: 2px 1px 0 1px;
-    width: 96px;
-    border: 1px solid #999;
+    margin: 0;
+    width: 99px;
+    border-bottom: 1px solid #999;
 }
 
 #conversejs .participants ul.participant-list li {

src/templates/chatarea.html

@@ -10,7 +10,7 @@
 </div>
 <div class="participants">
     <form class="room-invite">
-        <input class="invited-contact" placeholder="Invite someone" type="text"/>
+        <input class="invited-contact" placeholder="{{label_invitation}}" type="text"/>
     </form>
     <label>Participants:</label>
     <ul class="participant-list"></ul>