Hide inactive tab titles on small screens

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

@@ -183,7 +183,7 @@
                     border-bottom: 1px solid @alertify-fore;
                     margin-bottom: 10px;
                     box-sizing: content-box;
-                    span {
+                    .alertify-tabs-title {
                         .tools_unselectable();
                         font-size: 20px;
                         height: 40px;
@@ -200,6 +200,13 @@
                             color: #949494;
                             cursor: not-allowed;
                         }
+                        &:not(.alertify-tabs-active) {
+                            @media (max-width: @browser_media-medium-screen) {
+                                .tab-title-text {
+                                    display: none;
+                                }
+                            }
+                        }
                     }
                     span.alertify-tabs-active {
                         background-color: @alertify-fore !important;

www/common/common-interface.js

@@ -221,7 +221,7 @@ define([
         tabs.forEach(function (tab, i) {
             if (!(tab.content || tab.disabled) || !tab.title) { return; }
             var content = h('div.alertify-tabs-content', tab.content);
-            var title = h('span.alertify-tabs-title'+ (tab.disabled ? '.disabled' : ''), tab.title);
+            var title = h('span.alertify-tabs-title'+ (tab.disabled ? '.disabled' : ''), h('span.tab-title-text',tab.title));
             if (tab.icon) {
                 var icon = h('i', {class: tab.icon});
                 $(title).prepend(' ').prepend(icon);