Fix more section (small browser size)

This commit is contained in:
Julia Radzhabova 2022-07-13 19:30:38 +03:00
parent 55f2c25475
commit 634c0b6895
7 changed files with 26 additions and 3 deletions

View file

@ -562,7 +562,7 @@ define([
var need_break = false;
for (var i=items.length-1; i>=0; i--) {
var item = $(items[i]);
if (!item.is(':visible')) { // move invisible items as is and set special attr
if (!item.is(':visible') && !item.attr('hidden-on-resize')) { // move invisible items as is and set special attr
item.attr('data-hidden-tb-item', true);
this.$moreBar.prepend(item);
hideAllMenus = true;
@ -586,6 +586,7 @@ define([
this.$moreBar.prepend(item);
if (last_separator) {
last_separator.css('display', '');
last_separator.removeAttr('hidden-on-resize');
}
hideAllMenus = true;
} else if ( offset.left+item_width > _maxright ) {
@ -596,6 +597,7 @@ define([
this.$moreBar.prepend(item);
if (last_separator) {
last_separator.css('display', '');
last_separator.removeAttr('hidden-on-resize');
}
hideAllMenus = true;
break;
@ -613,6 +615,7 @@ define([
this.$moreBar.prepend(last_group);
if (last_separator) {
last_separator.css('display', '');
last_separator.removeAttr('hidden-on-resize');
}
}
last_group.prepend(child);
@ -639,6 +642,7 @@ define([
} else if (item.hasClass('separator')) {
this.$moreBar.prepend(item);
item.css('display', 'none');
item.attr('hidden-on-resize', true);
last_separator = item;
hideAllMenus = true;
}
@ -684,6 +688,7 @@ define([
more_section.before(item);
if (last_separator) {
last_separator.css('display', '');
last_separator.removeAttr('hidden-on-resize');
}
if (this.$moreBar.children().filter('.group').length == 0) {
this.hideMoreBtns();
@ -718,6 +723,7 @@ define([
more_section.before(last_group);
if (last_separator) {
last_separator.css('display', '');
last_separator.removeAttr('hidden-on-resize');
}
}
last_group.append(child);
@ -748,6 +754,7 @@ define([
} else if (item.hasClass('separator')) {
more_section.before(item);
item.css('display', 'none');
item.attr('hidden-on-resize', true);
last_separator = item;
last_width = parseInt(last_separator.css('margin-left')) + parseInt(last_separator.css('margin-right')) + 1;
hideAllMenus = true;
@ -780,7 +787,7 @@ define([
right = Common.Utils.innerWidth() - (showxy.left - parentxy.left + target.width()),
top = showxy.top - parentxy.top + target.height() + 10;
moreContainer.css({right: right, left: 'auto', top : top});
moreContainer.css({right: right, left: 'auto', top : top, 'max-width': Common.Utils.innerWidth() + 'px'});
moreContainer.show();
},

View file

@ -214,6 +214,7 @@
padding: 12px 10px 7px 0;
border-radius: 0;
z-index:999;
overflow: hidden;
.compactwidth {
.btn-group, .btn-toolbar {
&.x-huge {
@ -258,7 +259,7 @@
&.small {
padding-left: 10px;
+ .separator {
+ .separator:not(.invisible) {
margin-left: 10px;
}
}
@ -290,6 +291,11 @@
margin-left: 5px;
}
&.invisible {
margin-left: 0;
border: none;
}
&.long {
height: 52px;
}

View file

@ -86,6 +86,7 @@
<span class="btn-slot" id="slot-btn-mailrecepients" data-layout-name="toolbar-home-mailmerge"></span>
</div>
</div>
<div class="separator long invisible"></div>
<div class="group small flex field-styles" id="slot-field-styles" style="min-width: 160px;width: 100%; " data-group-width="100%"></div>
</section>
<section class="panel" data-tab="ins">

View file

@ -109,6 +109,7 @@
<span class="btn-slot split" id="slot-btn-slidesize"></span>
</div>
</div>
<div class="separator long invisible"></div>
<div class="group flex small field-styles" id="slot-field-styles" style="width: 100%; min-width: 140px;" data-group-width="100%"></div>
</section>
<section class="panel" data-tab="ins">
@ -127,6 +128,7 @@
<span class="btn-slot text x-huge slot-insertimg"></span>
<span class="btn-slot text x-huge" id="slot-btn-insertchart"></span>
</div>
<div class="separator long invisible"></div>
<div class="group small" id="slot-combo-insertshape"></div>
<div class="separator long"></div>
<div class="group">
@ -212,6 +214,7 @@
<div class="btn-slot text" id="animation-trigger"></div>
</div>
</div>
<div class="separator long invisible"></div>
<div class="group small">
<div class="elset font-normal">
<span class="btn-slot text" id="animation-duration"></span>
@ -222,6 +225,7 @@
<span id="animation-spin-delay" class="btn-slot text spinner" ></span>
</div>
</div>
<div class="separator long invisible"></div>
<div class="group small">
<div class="elset font-normal">
<span class="btn-slot text" id="animation-repeat"></span>

View file

@ -124,6 +124,7 @@
<span class="btn-slot split" id="slot-btn-table-tpl"></span>
</div>
</div>
<div class="separator long invisible"></div>
<div class="group small flex field-styles" id="slot-field-styles" style="min-width: 168px;width: 100%;" data-group-width="100%"></div>
</section>
<section class="panel" data-tab="ins">

View file

@ -79,6 +79,7 @@ define([
'<span class="btn-slot text" id="slot-chk-header-column"></span>' +
'</div>' +
'</div>' +
'<div class="separator long invisible"></div>' +
'<div class="group small">' +
'<div class="elset">' +
'<span class="btn-slot text" id="slot-chk-banded-row"></span>' +
@ -87,6 +88,7 @@ define([
'<span class="btn-slot text" id="slot-chk-banded-column"></span>' +
'</div>' +
'</div>' +
'<div class="separator long invisible"></div>' +
'<div class="group flex small" id="slot-field-pivot-styles" style="width: 324px;max-width: 324px;min-width: 105px;" data-group-width="324px">' +
'</div>' +
'</section>';

View file

@ -53,6 +53,7 @@ define([
'<span id="slot-btn-protect-sheet" class="btn-slot text x-huge" style="margin-right: 2px;"></span>' +
'<span id="slot-btn-allow-ranges" class="btn-slot text x-huge"></span>' +
'</div>' +
'<div class="separator long invisible"></div>' +
'<div class="group small">' +
'<div class="elset">' +
'<span class="btn-slot text" id="slot-chk-locked-cell"></span>' +
@ -61,6 +62,7 @@ define([
'<span class="btn-slot text" id="slot-chk-hidden-formula"></span>' +
'</div>' +
'</div>' +
'<div class="separator long invisible"></div>' +
'<div class="group small">' +
'<div class="elset">' +
'<span class="btn-slot text" id="slot-chk-locked-shape"></span>' +