CSS improvements.

- Last pending contact was being obscured/overflowing
- Select box for filtering was not aligned

Makefile

@@ -104,9 +104,11 @@ dev: stamp-bower stamp-bundler
 ########################################################################
 ## Builds
 
-css:: stamp-bundler
+sass::
 	$(SASS) -I ./components/bourbon/app/assets/stylesheets/ sass/converse.scss css/converse.css
 
+css:: stamp-bundler sass cssmin
+
 watch:: stamp-bundler
 	$(SASS) --watch -I ./components/bourbon/app/assets/stylesheets/ sass/converse.scss:css/converse.css
 

css/converse.css

@@ -686,6 +686,7 @@
     height: 194px;
     height: calc(100% - 50px - 20px);
     overflow: hidden;
+    padding-bottom: 1em;
     /* (jQ addClass:) if input has value: */
     /* (jQ addClass:) if mouse is over the 'x' input area*/ }
     #conversejs #converse-roster.no-contact-requests {
@@ -693,11 +694,13 @@
     #conversejs #converse-roster .filter-type {
       display: table-cell;
       float: right;
-      font-size: 14px;
+      font-size: calc(14px - 2px);
       height: 25px;
       margin: 0 0 0.5em -1px;
       padding: 0;
-      width: 84px; }
+      width: 84px;
+      border-radius: 0;
+      border: 1px solid; }
     #conversejs #converse-roster .roster-filter {
       float: left;
       background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg==) no-repeat right -20px center;

index.html

@@ -89,9 +89,9 @@
                 <div class="row">
                     <div class="col-md-8 col-md-offset-2 banner-social-buttons">
                         <ul class="list-inline">
-                            <li><a href="https://twitter.com/jcopkode" class="btn btn-circle btn-lg" title="Twitter" target="_blank"><i class="fa fa-twitter"></i></a>
+                            <li><a href="https://twitter.com/jcopkode" class="btn btn-circle btn-lg" title="Twitter" target="_blank"><i class="fa fa-twitter">Twitter</i></a>
                             </li>
-                            <li><a href="https://github.com/jcbrand/converse.js" class="btn btn-circle btn-lg" title="GitHub" target="_blank"><i class="fa fa-github"></i></a>
+                            <li><a href="https://github.com/jcbrand/converse.js" class="btn btn-circle btn-lg" title="GitHub" target="_blank"><i class="fa fa-github">Github</i></a>
                             </li>
                         </ul>
                     </div>

sass/_core.scss

@@ -731,6 +731,7 @@
     height: $roster-height;
     height: calc(100% - #{$controlbox-dropdown-height*2} - 20px);
     overflow: hidden;
+    padding-bottom: 1em;
 
     &.no-contact-requests {
         height: calc(100% - #{$controlbox-dropdown-height} - 20px);
@@ -739,11 +740,13 @@
     .filter-type {
       display: table-cell;
       float: right;
-      font-size: $font-size;
+      font-size: calc(#{$font-size} - 2px);
       height: $controlbox-dropdown-height;
       margin: 0 0 0.5em -1px;
       padding: 0;
       width: 84px;
+      border-radius: 0;
+      border: 1px solid;
     }
     .roster-filter {
       float: left;