mirror of
https://github.com/ONLYOFFICE/web-apps.git
synced 2026-07-24 01:53:55 +08:00
[SSE] Handle rtl sheets direction
This commit is contained in:
Julia Radzhabova
@ -286,6 +286,7 @@ define([
|
||||
Common.UI.BaseView.prototype.initialize.call(this, options);
|
||||
|
||||
this.saved = [];
|
||||
this.isRTL = options.isRTL || false;
|
||||
},
|
||||
|
||||
render: function () {
|
||||
@ -567,8 +568,8 @@ define([
|
||||
|
||||
checkInvisible: function(suppress) {
|
||||
var result = {
|
||||
first: !this.isTabVisible(Common.UI.isRTL() ? this.tabs.length-1 : 0),
|
||||
last: !this.isTabVisible(Common.UI.isRTL() ? 0 : this.tabs.length-1)
|
||||
first: !this.isTabVisible(this.isRTL ? this.tabs.length-1 : 0),
|
||||
last: !this.isTabVisible(this.isRTL ? 0 : this.tabs.length-1)
|
||||
};
|
||||
|
||||
!suppress && this.fireEvent('tab:invisible', this, result);
|
||||
@ -630,5 +631,9 @@ define([
|
||||
});
|
||||
return width;
|
||||
},
|
||||
|
||||
setDirection: function(isRTL) {
|
||||
this.isRTL = isRTL;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@ -315,7 +315,6 @@ define([
|
||||
onApiEditCell: function(state) {
|
||||
var disableAdd = (state == Asc.c_oAscCellEditorState.editFormula),
|
||||
disable = (state != Asc.c_oAscCellEditorState.editEnd),
|
||||
mask = $('.statusbar-mask'),
|
||||
statusbar = this.statusbar;
|
||||
|
||||
statusbar.isEditFormula = disableAdd;
|
||||
@ -326,14 +325,6 @@ define([
|
||||
statusbar.btnAddWorksheet.setDisabled(disable || this.api.asc_isWorkbookLocked() || this.api.asc_isProtectedWorkbook() || statusbar.rangeSelectionMode!=Asc.c_oAscSelectionDialogType.None);
|
||||
|
||||
statusbar.$el.find('#statusbar_bottom li span').attr('oo_editor_input', !disableAdd);
|
||||
|
||||
if (disableAdd && mask.length>0 || !disableAdd && mask.length==0) return;
|
||||
statusbar.$el.find('.statusbar').toggleClass('masked', disableAdd);
|
||||
if(disableAdd) {
|
||||
mask = $("<div class='statusbar-mask'>").appendTo(statusbar.$el);
|
||||
} else {
|
||||
mask.remove();
|
||||
}
|
||||
},
|
||||
|
||||
createDelayedElements: function() {
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
|
||||
<div class="statusbar">
|
||||
<div id="status-tabs-scroll" class="status-group float-left" dir="ltr">
|
||||
<div id="status-tabs-scroll" class="status-group" dir="ltr">
|
||||
<button id="status-btn-tabback" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="G"><i class="icon toolbar__icon btn-previtem"> </i></button>
|
||||
<button id="status-btn-tabnext" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="J"><i class="icon toolbar__icon btn-nextitem"> </i></button>
|
||||
</div>
|
||||
<div id="status-addtabs-box" class="status-group float-left">
|
||||
<div id="status-addtabs-box" class="status-group">
|
||||
<button id="status-btn-addtab" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="X"><i class="icon toolbar__icon btn-zoomup"> </i></button>
|
||||
<div class="cnt-tabslist">
|
||||
<button id="status-btn-tabslist" type="button" class="btn small btn-toolbar dropdown-toggle" data-toggle="dropdown" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="N"><i class="icon toolbar__icon btn-sheet-list"> </i></button>
|
||||
@ -20,7 +20,7 @@
|
||||
</div>
|
||||
<button id="status-btn-zoomup" type="button" class="btn small btn-toolbar"><i class="icon toolbar__icon btn-zoomup"> </i></button>
|
||||
</div>
|
||||
<div id="status-math-box" class="status-group padding-right-4">
|
||||
<div id="status-math-box" class="status-group">
|
||||
<div class="separator short"></div>
|
||||
<label id="status-math-average">AVERAGE: 10</label>
|
||||
<label id="status-math-count">COUNT: 3</label>
|
||||
|
||||
@ -83,6 +83,8 @@ define([
|
||||
|
||||
this.editMode = false;
|
||||
this.rangeSelectionMode = Asc.c_oAscSelectionDialogType.None;
|
||||
this.isRtlSheet = false;
|
||||
this.tabBarDefPosition = 129;
|
||||
|
||||
this.btnZoomDown = new Common.UI.Button({
|
||||
el: $('#status-btn-zoomdown',this.el),
|
||||
@ -224,7 +226,7 @@ define([
|
||||
{caption: '--'},
|
||||
{
|
||||
id: "id-tab-menu-new-color",
|
||||
template: _.template('<a tabindex="-1" type="menuitem" style="' + (Common.UI.isRTL() ? 'padding-right: 12px;': 'padding-left: 12px;') + '">' + me.textNewColor + '</a>')
|
||||
template: _.template('<a tabindex="-1" type="menuitem" style="' + (me.isRtlSheet ? 'padding-right: 12px;': 'padding-left: 12px;') + '">' + me.textNewColor + '</a>')
|
||||
}
|
||||
]
|
||||
});
|
||||
@ -401,6 +403,7 @@ define([
|
||||
setApi: function(api) {
|
||||
this.api = api;
|
||||
this.api.asc_registerCallback('asc_onSheetsChanged', _.bind(this.update, this));
|
||||
this.api.asc_registerCallback('asc_onUpdateSheetViewSettings', _.bind(this.onUpdateSheetViewSettings, this));
|
||||
return this;
|
||||
},
|
||||
|
||||
@ -513,6 +516,7 @@ define([
|
||||
|
||||
$('#status-label-zoom').text(Common.Utils.String.format(this.zoomText, Math.floor((this.api.asc_getZoom() +.005)*100)));
|
||||
|
||||
this.updateRtlSheet();
|
||||
this.updateNumberOfSheet(sindex, wc);
|
||||
this.updateTabbarBorders();
|
||||
|
||||
@ -522,6 +526,24 @@ define([
|
||||
}
|
||||
},
|
||||
|
||||
onUpdateSheetViewSettings: function() {
|
||||
var oldRtl = this.isRtlSheet;
|
||||
this.updateRtlSheet();
|
||||
(oldRtl !== this.isRtlSheet) && this.updateTabbarBorders();
|
||||
},
|
||||
|
||||
updateRtlSheet: function() {
|
||||
this.isRtlSheet = !!this.api.asc_getSheetViewSettings().asc_getRightToLeft();
|
||||
this.cntStatusbar.toggleClass('rtl-sheet', this.isRtlSheet);
|
||||
this.cntStatusbar.attr({dir: this.isRtlSheet ? 'rtl' : 'ltr'});
|
||||
this.tabbar.setDirection(this.isRtlSheet);
|
||||
var dir = (this.isCompact ? this.isRtlSheet : Common.UI.isRTL()) ? 'rtl' : 'ltr';
|
||||
this.boxZoom.attr({dir: dir});
|
||||
this.boxMath.attr({dir: dir});
|
||||
this.boxFiltered.attr({dir: dir});
|
||||
this.sheetListMenu.menuAlign = this.isRtlSheet ? 'br-tr' : 'bl-tl';
|
||||
},
|
||||
|
||||
setMathInfo: function(info) {
|
||||
if (info.count>1) {
|
||||
if (!this.boxMath.is(':visible')) this.boxMath.show();
|
||||
@ -600,6 +622,8 @@ define([
|
||||
this.tabbar.addDataHint(index, this.mode.isEditOle ? '1' : '0');
|
||||
}
|
||||
|
||||
this.updateRtlSheet();
|
||||
this.updateTabbarBorders();
|
||||
this.fireEvent('sheet:changed', [this, tab.sheetindex]);
|
||||
this.fireEvent('sheet:updateColors', [true]);
|
||||
|
||||
@ -676,7 +700,7 @@ define([
|
||||
|
||||
onTabMenuAfterShow: function (obj) {
|
||||
if (obj.atposition) {
|
||||
obj.setOffset(Common.UI.isRTL() ? (obj.atposition.right - $(obj.el).width()) : obj.atposition.left);
|
||||
obj.setOffset(this.isRtlSheet ? (obj.atposition.right - $(obj.el).width()) : obj.atposition.left);
|
||||
}
|
||||
|
||||
this.enableKeyEvents = true;
|
||||
@ -719,33 +743,33 @@ define([
|
||||
|
||||
updateTabbarBorders: function() {
|
||||
var visible = false;
|
||||
var right = parseInt(this.boxZoom.css('width'));
|
||||
var right = parseFloat(this.boxZoom.css('width'));
|
||||
if (this.boxMath.is(':visible')) {
|
||||
if (Common.UI.isRTL()) {
|
||||
this.boxMath.css({'left': right + 'px'});
|
||||
if (this.isCompact && this.isRtlSheet || !this.isCompact && Common.UI.isRTL()) {
|
||||
this.boxMath.css({'left': right + 'px', 'right': 'auto'});
|
||||
} else {
|
||||
this.boxMath.css({'right': right + 'px'});
|
||||
this.boxMath.css({'right': right + 'px', 'left': 'auto'});
|
||||
}
|
||||
right += parseInt(this.boxMath.css('width'));
|
||||
right += parseFloat(this.boxMath.css('width'));
|
||||
visible = true;
|
||||
}
|
||||
if (this.boxFiltered.is(':visible')) {
|
||||
if (Common.UI.isRTL()) {
|
||||
this.boxFiltered.css({'left': right + 'px'});
|
||||
if (this.isCompact && this.isRtlSheet || !this.isCompact && Common.UI.isRTL()) {
|
||||
this.boxFiltered.css({'left': right + 'px', 'right': 'auto'});
|
||||
} else {
|
||||
this.boxFiltered.css({'right': right + 'px'});
|
||||
this.boxFiltered.css({'right': right + 'px', 'left': 'auto'});
|
||||
}
|
||||
right += parseInt(this.boxFiltered.css('width'));
|
||||
right += parseFloat(this.boxFiltered.css('width'));
|
||||
visible = true;
|
||||
}
|
||||
|
||||
if (this.isCompact) {
|
||||
var tabsWidth = this.tabbar.getWidth();
|
||||
if (this.boxAction.is(':visible')) {
|
||||
var tabsWidth = this.tabbar.getWidth();
|
||||
var actionWidth = this.actionWidth || 140;
|
||||
if (Common.Utils.innerWidth() - right - 129 - actionWidth - tabsWidth > 0) { // docWidth - right - left - this.boxAction.width
|
||||
var left = tabsWidth + 129;
|
||||
if (Common.UI.isRTL()) {
|
||||
if (Common.Utils.innerWidth() - right - this.tabBarDefPosition - actionWidth - tabsWidth > 0) { // docWidth - right - left - this.boxAction.width
|
||||
var left = tabsWidth + this.tabBarDefPosition;
|
||||
if (this.isRtlSheet) {
|
||||
this.boxAction.css({'left': right + 'px', 'right': left + 'px', 'width': 'auto'});
|
||||
this.boxAction.find('.separator').css('border-right-color', 'transparent');
|
||||
} else {
|
||||
@ -753,7 +777,7 @@ define([
|
||||
this.boxAction.find('.separator').css('border-left-color', 'transparent');
|
||||
}
|
||||
} else {
|
||||
if (Common.UI.isRTL()) {
|
||||
if (this.isRtlSheet) {
|
||||
this.boxAction.css({'left': right + 'px', 'right': 'auto', 'width': actionWidth + 'px'});
|
||||
this.boxAction.find('.separator').css('border-right-color', '');
|
||||
} else {
|
||||
@ -763,15 +787,20 @@ define([
|
||||
visible = true;
|
||||
}
|
||||
right += parseInt(this.boxAction.css('width'));
|
||||
}
|
||||
} else if (Common.Utils.innerWidth() - right - this.tabBarDefPosition - tabsWidth <=0)
|
||||
visible = true;
|
||||
|
||||
this.boxMath.is(':visible') && this.boxMath.css({'top': '0px', 'bottom': 'auto'});
|
||||
this.boxFiltered.is(':visible') && this.boxFiltered.css({'top': '0px', 'bottom': 'auto'});
|
||||
this.boxZoom.css({'top': '0px', 'bottom': 'auto'});
|
||||
if (Common.UI.isRTL()) {
|
||||
if (this.isRtlSheet) {
|
||||
this.tabBarBox.css('left', right + 'px');
|
||||
this.tabBarBox.css('right', this.tabBarDefPosition + 'px');
|
||||
this.boxZoom.find('.separator').css('border-right-color', visible ? '' : 'transparent');
|
||||
} else {
|
||||
this.tabBarBox.css('left', this.tabBarDefPosition + 'px');
|
||||
this.tabBarBox.css('right', right + 'px');
|
||||
this.boxZoom.find('.separator').css('border-left-color', visible ? '' : 'transparent');
|
||||
}
|
||||
} else {
|
||||
if (this.boxAction.is(':visible')) {
|
||||
@ -786,12 +815,13 @@ define([
|
||||
this.boxMath.is(':visible') && this.boxMath.css({'top': 'auto', 'bottom': '0px'});
|
||||
this.boxFiltered.is(':visible') && this.boxFiltered.css({'top': 'auto', 'bottom': '0px'});
|
||||
this.boxZoom.css({'top': 'auto', 'bottom': '0px'});
|
||||
if (Common.UI.isRTL()) {
|
||||
this.boxZoom.find('.separator').css(Common.UI.isRTL() ? 'border-right-color' : 'border-left-color', visible ? '' : 'transparent');
|
||||
if (this.isRtlSheet) {
|
||||
this.tabBarBox.css('left', '0px');
|
||||
this.boxZoom.find('.separator').css('border-right-color', visible ? '' : 'transparent');
|
||||
this.tabBarBox.css('right', this.tabBarDefPosition + 'px');
|
||||
} else {
|
||||
this.tabBarBox.css('left', this.tabBarDefPosition + 'px');
|
||||
this.tabBarBox.css('right', '0px');
|
||||
this.boxZoom.find('.separator').css('border-left-color', visible ? '' : 'transparent');
|
||||
}
|
||||
}
|
||||
|
||||
@ -820,9 +850,9 @@ define([
|
||||
|
||||
changeViewMode: function (mode) {
|
||||
var edit = mode.isEdit,
|
||||
styleLeft = Common.UI.isRTL() ? 'right' : 'left';
|
||||
styleLeft = this.isRtlSheet ? 'right' : 'left';
|
||||
if (edit) {
|
||||
this.tabBarBox.css(styleLeft, '129px');
|
||||
this.tabBarBox.css(styleLeft, this.tabBarDefPosition + 'px');
|
||||
} else {
|
||||
this.tabBarBox.css(styleLeft, '');
|
||||
}
|
||||
@ -897,6 +927,7 @@ define([
|
||||
this.boxNumberSheets.show();
|
||||
//this.boxAction.show();
|
||||
}
|
||||
this.updateRtlSheet();
|
||||
this.updateTabbarBorders();
|
||||
(this.tabbar.getCount()>0) && this.onTabInvisible(undefined, this.tabbar.checkInvisible(true));
|
||||
},
|
||||
|
||||
@ -2,13 +2,55 @@
|
||||
padding: 0 2px 0;
|
||||
z-index: 500;
|
||||
|
||||
.margin-left-sheet(@value) {
|
||||
margin-left: @value;
|
||||
margin-right: 0;
|
||||
|
||||
.rtl-sheet& {
|
||||
margin-left: 0;
|
||||
margin-right: @value;
|
||||
}
|
||||
}
|
||||
|
||||
.margin-right-sheet(@value) {
|
||||
margin-right: @value;
|
||||
margin-left: 0;
|
||||
|
||||
.rtl-sheet& {
|
||||
margin-right: 0;
|
||||
margin-left: @value;
|
||||
}
|
||||
}
|
||||
|
||||
.padding-x-sheet(@left, @right) {
|
||||
padding-left: @left;
|
||||
padding-right: @right;
|
||||
|
||||
.rtl-sheet& {
|
||||
padding-left: @right;
|
||||
padding-right: @left;
|
||||
}
|
||||
}
|
||||
|
||||
.padding-right-sheet(@value) {
|
||||
padding-right: @value;
|
||||
padding-left: 0;
|
||||
.rtl-sheet& {
|
||||
padding-right: 0;
|
||||
padding-left: @value;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#status-tabs-scroll {
|
||||
width: 66px;
|
||||
padding: 3px 12px 0 10px;
|
||||
height: 25px;
|
||||
float: left;
|
||||
|
||||
.rtl & {
|
||||
.rtl-sheet& {
|
||||
padding: 3px 10px 0 12px;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
@ -16,26 +58,12 @@
|
||||
padding-top: 3px;
|
||||
|
||||
position: absolute;
|
||||
right: 0;
|
||||
height: 25px;
|
||||
|
||||
.rtl & {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.separator {
|
||||
margin-top: -3px;
|
||||
}
|
||||
|
||||
#status-btn-zoomup {
|
||||
.margin-right(40px);
|
||||
}
|
||||
|
||||
#status-btn-zoomdown {
|
||||
.margin-left-10();
|
||||
}
|
||||
|
||||
#status-label-zoom {
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
@ -45,55 +73,121 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
&.no-compact {
|
||||
#status-zoom-box {
|
||||
right: 0;
|
||||
.rtl & {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
#status-btn-zoomup {
|
||||
.margin-right(40px);
|
||||
}
|
||||
|
||||
#status-btn-zoomdown {
|
||||
.margin-left-10();
|
||||
}
|
||||
#status-math-box {
|
||||
.padding-right-4();
|
||||
label {
|
||||
.padding-right-10();
|
||||
}
|
||||
}
|
||||
#status-filtered-box {
|
||||
.padding-right(14px);
|
||||
label:not(:last-child) {
|
||||
.padding-right-10();
|
||||
}
|
||||
}
|
||||
#status-math-box,
|
||||
#status-filtered-box {
|
||||
.separator {
|
||||
.padding-right(11px);
|
||||
}
|
||||
}
|
||||
}
|
||||
&:not(.no-compact) {
|
||||
#status-zoom-box {
|
||||
right: 0;
|
||||
.rtl-sheet& {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
#status-btn-zoomup {
|
||||
.margin-right-sheet(40px);
|
||||
}
|
||||
#status-btn-zoomdown {
|
||||
.margin-left-sheet(10px);
|
||||
}
|
||||
#status-math-box {
|
||||
.padding-right-sheet(4px);
|
||||
label {
|
||||
.padding-right-sheet(10px);
|
||||
}
|
||||
}
|
||||
#status-filtered-box {
|
||||
.padding-right-sheet(14px);
|
||||
label:not(:last-child) {
|
||||
.padding-right-sheet(10px);
|
||||
}
|
||||
}
|
||||
#status-math-box,
|
||||
#status-filtered-box {
|
||||
.separator {
|
||||
.padding-right-sheet(11px);
|
||||
}
|
||||
}
|
||||
#status-math-box,
|
||||
#status-filtered-box,
|
||||
#status-zoom-box,
|
||||
#status-action {
|
||||
.separator {
|
||||
border-right: none;
|
||||
border-left: @scaled-one-px-value-ie solid @border-divider-ie;
|
||||
border-left: @scaled-one-px-value solid @border-divider;
|
||||
.rtl-sheet& {
|
||||
border-left: none;
|
||||
border-right: @scaled-one-px-value-ie solid @border-divider-ie;
|
||||
border-right: @scaled-one-px-value solid @border-divider;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#status-addtabs-box {
|
||||
padding: 3px 8px 0 8px;
|
||||
padding: 3px 8px 0;
|
||||
border-left: @scaled-one-px-value-ie solid @border-toolbar-ie;
|
||||
border-left: @scaled-one-px-value solid @border-toolbar;
|
||||
border-right: @scaled-one-px-value-ie solid @border-toolbar-ie;
|
||||
border-right: @scaled-one-px-value solid @border-toolbar;
|
||||
height: 25px;
|
||||
float: left;
|
||||
.rtl-sheet& {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
#status-math-box,
|
||||
#status-filtered-box {
|
||||
//float: right;
|
||||
padding-top: 6px;
|
||||
|
||||
position: absolute;
|
||||
height: 25px;
|
||||
|
||||
.separator {
|
||||
position: relative;
|
||||
.padding-right(11px);
|
||||
margin-top: -6px;
|
||||
}
|
||||
}
|
||||
|
||||
#status-math-box {
|
||||
label {
|
||||
.padding-right-10();
|
||||
}
|
||||
}
|
||||
|
||||
#status-filtered-box {
|
||||
.padding-right(14px);
|
||||
label {
|
||||
&:not(:last-child) {
|
||||
.padding-right-10();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#status-sheets-bar-box {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
height: 25px;
|
||||
left: 66px;
|
||||
right: 160px;
|
||||
//margin-right: 3px;
|
||||
|
||||
.rtl & {
|
||||
.rtl-sheet& {
|
||||
left: 160px;
|
||||
right: 66px;
|
||||
}
|
||||
@ -118,7 +212,7 @@
|
||||
&:first-of-type {
|
||||
span {
|
||||
border-left: none;
|
||||
.rtl & {
|
||||
.rtl-sheet& {
|
||||
border-left: @scaled-one-px-value-ie solid @border-toolbar-ie;
|
||||
border-left: @scaled-one-px-value solid @border-toolbar;
|
||||
border-right: none;
|
||||
@ -127,12 +221,9 @@
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
span {
|
||||
> span {
|
||||
margin-right: 0;
|
||||
|
||||
.rtl & {
|
||||
margin-left: 0;
|
||||
}
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -148,7 +239,6 @@
|
||||
.border-radius(0);
|
||||
padding: 0 10px 0;
|
||||
line-height: 24px;
|
||||
.margin-right(-1px);
|
||||
background-color: @background-toolbar-additional-ie;
|
||||
background-color: @background-toolbar-additional;
|
||||
outline: none;
|
||||
@ -158,7 +248,7 @@
|
||||
border-right: @scaled-one-px-value solid @border-toolbar;
|
||||
border-top: @scaled-one-px-value-ie solid @border-toolbar-ie;
|
||||
border-top: @scaled-one-px-value solid @border-toolbar;
|
||||
|
||||
.margin-right-sheet(-1px);
|
||||
&:hover {
|
||||
border-top-color: @border-toolbar-ie;
|
||||
border-top-color: @border-toolbar;
|
||||
@ -215,10 +305,9 @@
|
||||
border-bottom: 7px solid red;
|
||||
border-left: 7px solid transparent;
|
||||
bottom: 0;
|
||||
.margin-left(-7px);
|
||||
left: 100%;
|
||||
|
||||
.rtl & {
|
||||
.margin-left-sheet(-7px);
|
||||
.rtl-sheet& {
|
||||
border-left: none;
|
||||
border-right: 7px solid transparent;
|
||||
left: auto;
|
||||
@ -229,7 +318,7 @@
|
||||
|
||||
&.icon-visible {
|
||||
> span {
|
||||
.padding-x(25px, 10px);
|
||||
.padding-x-sheet(25px, 10px);
|
||||
> .toolbar__icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
@ -237,7 +326,7 @@
|
||||
top: 0;
|
||||
left: 0;
|
||||
margin: 3px;
|
||||
.rtl & {
|
||||
.rtl-sheet& {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
@ -260,15 +349,15 @@
|
||||
|
||||
&:first-child {
|
||||
> span {
|
||||
.padding-x(8px, 10px);
|
||||
.padding-x-sheet(8px, 10px);
|
||||
}
|
||||
}
|
||||
|
||||
> span {
|
||||
border-left: 2px solid @text-normal-ie;
|
||||
border-left: 2px solid @text-normal;
|
||||
.padding-x(9px, 10px);
|
||||
.rtl & {
|
||||
.padding-x-sheet(9px, 10px);
|
||||
.rtl-sheet& {
|
||||
border-left: @scaled-one-px-value-ie solid @border-toolbar-ie;
|
||||
border-left: @scaled-one-px-value solid @border-toolbar;
|
||||
border-right: 2px solid @text-normal-ie;
|
||||
@ -282,8 +371,8 @@
|
||||
border-left: @scaled-one-px-value solid @border-toolbar;
|
||||
border-right: 2px solid @text-normal-ie;
|
||||
border-right: 2px solid @text-normal;
|
||||
.padding-x(10px, 9px);
|
||||
.rtl & {
|
||||
.padding-x-sheet(10px, 9px);
|
||||
.rtl-sheet& {
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
border-right: @scaled-one-px-value-ie solid @border-toolbar-ie;
|
||||
@ -295,18 +384,18 @@
|
||||
}
|
||||
&.icon-visible {
|
||||
> span {
|
||||
.padding-x(24px, 10px);
|
||||
.padding-x-sheet(24px, 10px);
|
||||
}
|
||||
&.right {
|
||||
> span {
|
||||
.padding-x(25px, 10px);
|
||||
.padding-x-sheet(25px, 10px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.separator-item {
|
||||
margin-top: 1px;
|
||||
.margin-left-20();
|
||||
.margin-left-sheet(20px);
|
||||
width: @scaled-one-px-value-ie;
|
||||
width: @scaled-one-px-value;
|
||||
> span {
|
||||
@ -346,6 +435,11 @@
|
||||
|
||||
#status-number-of-sheet {
|
||||
width: 135px;
|
||||
left: 0;
|
||||
.rtl & {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.no-compact {
|
||||
@ -388,8 +482,6 @@
|
||||
position: relative;
|
||||
.dropdown-menu {
|
||||
min-width: 112px;
|
||||
.margin-left(-4px);
|
||||
|
||||
li {
|
||||
.text-align-left();
|
||||
a {
|
||||
@ -426,8 +518,6 @@
|
||||
|
||||
.dropdown-menu {
|
||||
min-width: 80px;
|
||||
.margin-left(-4px);
|
||||
|
||||
li {
|
||||
> a {
|
||||
text-align: center;
|
||||
@ -456,7 +546,6 @@
|
||||
#statusbar-menu {
|
||||
.dropdown-menu {
|
||||
margin-top: 0;
|
||||
.margin-left(-7px);
|
||||
li {
|
||||
> a {
|
||||
padding: 5px 12px 5px 26px;
|
||||
@ -484,26 +573,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
.statusbar-mask {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 115px;
|
||||
width: 36px;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
background-color: @background-toolbar-ie;
|
||||
background-color: @background-toolbar;
|
||||
z-index: @zindex-modal - 1;
|
||||
.rtl & {
|
||||
left: auto;
|
||||
right: 115px;
|
||||
}
|
||||
}
|
||||
|
||||
.over-box {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.rtl .nav {
|
||||
.rtl-sheet .nav {
|
||||
padding-right: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user