Use fixed width for badges

issue7251
review41961002

src/sao.less

@@ -44,11 +44,21 @@
 
     & .navbar-btn {
         .badge {
+            max-width: 3em;
+            min-width: 3em;
+            overflow: hidden;
+            text-overflow: ellipsis;
             /* remove padding to not increase size of navbar-btn */
             margin-top: -3px;
             margin-bottom: -3px;
         }
     }
+
+    & .tab-domain {
+        & .badge {
+            min-width: 3em;
+        }
+    }
 }
 
 @media screen and (max-width: @screen-xs-max) {

src/tab.js

@@ -862,6 +862,8 @@
                 }).appendTo(this.buttons.attach);
             }
             badge.text(count);
+            this.buttons.attach.attr(
+                'title', Sao.i18n.gettext("Attachement(%1)", count));
             var record_id = this.screen.get_id();
             this.buttons.attach.prop('disabled',
                 record_id < 0 || record_id === null);
@@ -892,6 +894,8 @@
                 }).appendTo(this.buttons.note);
             }
             badge.text(unread);
+            this.buttons.note.attr(
+                'title', Sao.i18n.gettext("Note(%1)", unread));
             var record_id = this.screen.get_id();
             this.buttons.note.prop('disabled',
                     record_id < 0 || record_id === null);