From 8992ac67c5a0fa20d6d86a42e1a5e2a906b2f111 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Wed, 13 May 2020 15:54:36 +0200
Subject: [PATCH] Remove button text on small screens

---
 customize.dist/src/less2/include/toolbar.less | 17 +++++++++++++++++
 www/common/toolbar.js                         | 14 ++++++++++++++
 2 files changed, 31 insertions(+)

diff --git a/customize.dist/src/less2/include/toolbar.less b/customize.dist/src/less2/include/toolbar.less
index d28b9d8f0..ad7ab4d22 100644
--- a/customize.dist/src/less2/include/toolbar.less
+++ b/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 {
diff --git a/www/common/toolbar.js b/www/common/toolbar.js
index 00c24bfae..9efbd7a4d 100644
--- a/www/common/toolbar.js
+++ b/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; }