Remove button text on small screens

customize.dist/src/less2/include/toolbar.less

@@ -964,6 +964,18 @@
                 margin-right: 5px;
             }
         }
+
+        &.cp-toolbar-small {
+            button {
+                .cp-toolbar-name, .cp-button-name {
+                    display: none;
+                }
+                i {
+                    margin-right: 0;
+                }
+            }
+        }
+
         .cp-dropdown-content {
             margin-top: -1px;
         }
@@ -988,6 +1000,11 @@
             #cp-toolbar-userlist-drawer-open { order: 1; }
         }
 
+        .cp-toolbar-bottom-right {
+            button {
+                white-space: nowrap;
+            }
+        }
         .cp-toolbar-bottom-left {
             .cp-toolbar-appmenu, .cp-toolbar-file {
                 button {

www/common/toolbar.js

@@ -1247,6 +1247,18 @@ MessengerUI, Messages) {
             ], {});
         };
 
+        var checkSize = function () {
+            toolbar.$bottom.removeClass('cp-toolbar-small');
+            var w = $(window).width();
+            var size = toolbar.$bottomL.width() + toolbar.$bottomM.width() +
+                       toolbar.$bottomR.width();
+            if (size > w) {
+                toolbar.$bottom.addClass('cp-toolbar-small');
+            }
+        };
+
+        $(window).on('resize', checkSize);
+
         var addElement = toolbar.addElement = function (arr, additionalCfg, init) {
             if (typeof additionalCfg === "object") { $.extend(true, config, additionalCfg); }
             arr.forEach(function (el) {
@@ -1257,10 +1269,12 @@ MessengerUI, Messages) {
                     if (!init) { config.displayed.push(el); }
                 }
             });
+            checkSize();
         };
 
         addElement(config.displayed, {}, true);
 
+
         toolbar['linkToMain'] = createLinkToMain(toolbar, config);
 
         if (!config.realtime) { toolbar.connected = true; }