diff --git a/apps/common/main/lib/component/Button.js b/apps/common/main/lib/component/Button.js index 02c53ac13..e30f72004 100644 --- a/apps/common/main/lib/component/Button.js +++ b/apps/common/main/lib/component/Button.js @@ -226,8 +226,9 @@ define([ '' + '' + ''; @@ -342,6 +343,20 @@ define([ } else { this.template = _.template(templateHugeCaption); } + var words = me.caption.split(' '), + newCaption = null; + if (words.length > 1) { + if (words.length < 3) { + newCaption = words[0] + '
' + words[1]; + } else { + newCaption = words[0] + ' ' + words[1] + '
' + words[2]; + } + } else if (!!me.menu || me.split === true) { + newCaption = me.caption + '
'; + } + if (newCaption) { + me.caption = newCaption; + } } me.cmpEl = $(this.template({ diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 8eb3886d7..6e0b6b994 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -1,4 +1,4 @@ -@x-huge-btn-height: 46px; +@x-huge-btn-height: 48px; @x-huge-btn-icon-size: 28px; .btn { @@ -70,8 +70,6 @@ transition: transform 0.2s ease; transform: rotate(-135deg) translate(1px,1px); - - margin: 0 1px 0 4px; } //&:active, @@ -233,17 +231,21 @@ line-height: 18px; padding: 0 2px; display: flex; - align-items: center; - //align-items: start; + //align-items: center; + align-items: start; .caption { - //max-width: 107px; + max-width: 85px; + max-height: 22px; text-overflow: ellipsis; - overflow: hidden; white-space: pre-line; - line-height: 11px; - padding-right: 0; + line-height: 10px; + padding: 0 2px; + + .caret { + margin: 0 1px 0 4px; + } } } @@ -277,6 +279,7 @@ //max-width: 100px; } } + } .inner-box-icon { @@ -302,7 +305,7 @@ .inner-box-caption { margin: 0; - height: 18px; + height: 20px; } div.inner-box-icon { diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 8f915506c..8872a4f69 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -162,7 +162,7 @@ .box-controls { //height: @height-controls; // button has strange offset in IE when odd height - padding: 10px 0; + padding: 9px 0; display: flex; //background-color: #F2CBBF;