Some CSS tweaks to make converse.js look better in a bootstrap site.

css/converse.css

@@ -75,6 +75,8 @@
     font-size: 14px;
     padding: 0.25em;
     min-height: 0; }
+  #conversejs input[type=text] {
+    height: 25px; }
   #conversejs strong {
     font-weight: 700; }
   #conversejs ol, #conversejs ul {
@@ -96,10 +98,14 @@
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale; }
   #conversejs [class^="icon-"], #conversejs [class*=" icon-"] {
+    background-position: 14px 14px;
+    background-image: none;
     font-family: 'Converse-js';
     font-style: normal;
     font-variant: normal;
     font-weight: normal;
+    width: auto;
+    height: auto;
     line-height: 1;
     speak: none;
     text-transform: none;
@@ -306,30 +312,14 @@
     padding-right: 22px; }
 @-webkit-keyframes spin {
   from {
-    -webkit-transform: rotate(0deg);
-    -moz-transform: rotate(0deg);
-    -ms-transform: rotate(0deg);
-    -o-transform: rotate(0deg);
-    transform: rotate(0deg); }
+    -webkit-transform: rotate(0deg); }
   to {
-    -webkit-transform: rotate(359deg);
-    -moz-transform: rotate(359deg);
-    -ms-transform: rotate(359deg);
-    -o-transform: rotate(359deg);
-    transform: rotate(359deg); } }
+    -webkit-transform: rotate(359deg); } }
 @-moz-keyframes spin {
   from {
-    -webkit-transform: rotate(0deg);
-    -moz-transform: rotate(0deg);
-    -ms-transform: rotate(0deg);
-    -o-transform: rotate(0deg);
-    transform: rotate(0deg); }
+    -moz-transform: rotate(0deg); }
   to {
-    -webkit-transform: rotate(359deg);
-    -moz-transform: rotate(359deg);
-    -ms-transform: rotate(359deg);
-    -o-transform: rotate(359deg);
-    transform: rotate(359deg); } }
+    -moz-transform: rotate(359deg); } }
 @keyframes spin {
   from {
     -webkit-transform: rotate(0deg);

sass/converse.scss

@@ -6,6 +6,8 @@
  * Licensed under the Mozilla Public License
  */
 
+@import "../ruby/1.9.1/gems/bourbon-4.2.1/app/assets/stylesheets/_bourbon";
+
 @font-face {
   font-family: 'Converse-js';
   src: url('../fonticons/fonts/icomoon.eot?-mnoxh0');
@@ -31,7 +33,6 @@
 }
 
 #conversejs {
-  @import "../bourbon/bourbon";
   @import "variables";
 
   ::selection {
@@ -87,6 +88,10 @@
     min-height: 0;
   }
 
+  input[type=text] {
+    height: 26px;
+  }
+
   strong {
     font-weight: 700;
   }
@@ -118,10 +123,14 @@
   }
 
   [class^="icon-"], [class*=" icon-"] {
+    background-position: 14px 14px;
+    background-image: none;
     font-family: 'Converse-js';
     font-style: normal;
     font-variant: normal;
     font-weight: normal;
+    width: auto;
+    height: auto;
     line-height: 1;
     speak: none;
     text-transform: none;