Add overflow for very long bookmark names

css/converse.css

@@ -2168,15 +2168,21 @@
     bottom: 10px; }
 
 #conversejs #controlbox .bookmarks-list {
-  margin-top: 1em; }
+  margin-top: 2em; }
   #conversejs #controlbox .bookmarks-list .bookmarks-toggle {
     display: block;
     font-weight: bold;
-    color: #818479; }
+    color: #818479;
+    margin-bottom: 0.5em; }
   #conversejs #controlbox .bookmarks-list .bookmarks li {
-    padding: 1em 1em; }
+    padding: 0.3em 1em; }
     #conversejs #controlbox .bookmarks-list .bookmarks li .open-room {
-      float: left; }
+      display: inline-block;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      width: 75%;
+      text-align: left; }
     #conversejs #controlbox .bookmarks-list .bookmarks li .room-info {
       float: right; }
     #conversejs #controlbox .bookmarks-list .bookmarks li .remove-bookmark {

sass/_bookmarks.scss

 #conversejs {
     #controlbox {
         .bookmarks-list {
-            margin-top: 1em;
+            margin-top: 2em;
             .bookmarks-toggle {
                 display: block;
                 font-weight: bold;
                 color: $text-color;
+                margin-bottom: 0.5em;
             }
             .bookmarks {
                 li {
-                    padding: 1em 1em;
+                    padding: 0.3em 1em;
                     .open-room {
-                        float: left;
+                        display: inline-block;
+                        overflow: hidden;
+                        white-space: nowrap;
+                        text-overflow: ellipsis;
+                        width: 75%;
+                        text-align: left;
                     }
                     .room-info {
                         float: right;

spec/bookmarks.js

@@ -404,14 +404,18 @@
                                         'autojoin': 'false',
                                         'jid': 'theplay@conference.shakespeare.lit'
                                     }).c('nick').t('JC').up().up()
+                                    .c('conference', {
+                                        'name': 'Bookmark with a very very long name that will be shortened',
+                                        'autojoin': 'false',
+                                        'jid': 'theplay@conference.shakespeare.lit'
+                                    }).c('nick').t('JC').up().up()
                                     .c('conference', {
                                         'name': 'Another room',
                                         'autojoin': 'false',
                                         'jid': 'another@conference.shakespeare.lit'
                                     }).c('nick').t('JC').up().up();
                 converse.connection._dataRecv(test_utils.createRequest(stanza));
-                expect(converse.bookmarks.models.length).toBe(2);
-                expect($('#chatrooms ul.bookmarks li').length).toBe(2);
+                expect($('#chatrooms ul.bookmarks li').length).toBe(3);
             });
         });
     });