From 011ac805543ad8e9134185f857559baf4c2627bc Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Tue, 18 Oct 2022 22:32:35 +0300 Subject: [PATCH] [rtl] Make ComboDataviewShape, list styles --- .../main/lib/component/ComboDataViewShape.js | 5 ++++- .../main/resources/less/combo-dataview.less | 22 +++++++++++++++++++ apps/common/main/resources/less/dataview.less | 4 ++++ apps/common/main/resources/less/toolbar.less | 4 ++++ apps/documenteditor/main/app/view/Toolbar.js | 5 ++++- .../main/app/view/Toolbar.js | 5 ++++- .../main/app/view/Toolbar.js | 5 ++++- 7 files changed, 46 insertions(+), 4 deletions(-) diff --git a/apps/common/main/lib/component/ComboDataViewShape.js b/apps/common/main/lib/component/ComboDataViewShape.js index 5de245ba7..7a68fc268 100644 --- a/apps/common/main/lib/component/ComboDataViewShape.js +++ b/apps/common/main/lib/component/ComboDataViewShape.js @@ -368,7 +368,10 @@ define([ if (menu.cmpEl) { menu.menuAlignEl = this.cmpEl; var offset = this.cmpEl.width() - this.openButton.$el.width() - this.menuWidth + 1; - menu.setOffset(Math.min(offset, 0)); + if (Common.UI.isRTL()) { + offset = this.openButton.$el.width() - 1; + } + menu.setOffset(Common.UI.isRTL() ? offset : Math.min(offset, 0)); } if (this.options.hint) { diff --git a/apps/common/main/resources/less/combo-dataview.less b/apps/common/main/resources/less/combo-dataview.less index fecb3727e..99c941e91 100644 --- a/apps/common/main/resources/less/combo-dataview.less +++ b/apps/common/main/resources/less/combo-dataview.less @@ -15,6 +15,10 @@ background-color: @background-normal-ie; background-color: @background-normal; + .rtl & { + float: right; + } + .dataview { padding: 1px; } @@ -24,6 +28,10 @@ display: inline-block; float: right; + .rtl & { + float: left; + } + button { border-radius:0 @border-radius-small @border-radius-small 0; border: @scaled-one-px-value-ie solid @border-regular-control-ie; @@ -31,6 +39,10 @@ background-color: @background-normal-ie; background-color: @background-normal; + .rtl & { + border-radius:@border-radius-small 0 0 @border-radius-small; + } + &.dropdown-toggle { .inner-box-caret { padding: 0 1px 0 0; @@ -93,6 +105,16 @@ .border-left-radius(0); + .rtl & { + margin-right: 0; + padding-right: 0; + margin-left: -@combo-dataview-button-width; + padding-left: @combo-dataview-button-width; + + .border-radius(@border-radius-small); + .border-right-radius(0); + } + .dataview { @minus-px: calc(-1px / @pixel-ratio-factor); height: @combo-dataview-height; diff --git a/apps/common/main/resources/less/dataview.less b/apps/common/main/resources/less/dataview.less index a62d4a970..b19dcd82f 100644 --- a/apps/common/main/resources/less/dataview.less +++ b/apps/common/main/resources/less/dataview.less @@ -26,6 +26,10 @@ .box-shadow(0 0 0 @scaled-one-px-value-ie @border-regular-control-ie); .box-shadow(0 0 0 @scaled-one-px-value @border-regular-control); + .rtl & { + float: right; + } + &:hover, &.selected { .box-shadow(0 0 0 2px @border-preview-select-ie); diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index b95e5a40c..35699e44e 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -652,6 +652,10 @@ height: 46px; .view { padding-right: 14px; + .rtl & { + padding-right: 0; + padding-left: 14px; + } } .dataview.field-picker { height: 100%; diff --git a/apps/documenteditor/main/app/view/Toolbar.js b/apps/documenteditor/main/app/view/Toolbar.js index 91b3943a7..3d5eb1986 100644 --- a/apps/documenteditor/main/app/view/Toolbar.js +++ b/apps/documenteditor/main/app/view/Toolbar.js @@ -1535,7 +1535,10 @@ define([ if (menuWidth>Common.Utils.innerWidth()) menuWidth = Math.max(Math.floor(Common.Utils.innerWidth()/(itemMargin + _width)), 2) * (itemMargin + _width); var offset = cmp.cmpEl.width() - cmp.openButton.$el.width() - Math.min(menuWidth, buttonOffsetLeft) - 1; - menu.setOffset(Math.min(offset, 0)); + if (Common.UI.isRTL()) { + offset = cmp.openButton.$el.width(); + } + menu.setOffset(Common.UI.isRTL() ? offset : Math.min(offset, 0)); menu.cmpEl.css({ 'width': menuWidth, diff --git a/apps/presentationeditor/main/app/view/Toolbar.js b/apps/presentationeditor/main/app/view/Toolbar.js index 66cb3de83..706646f1f 100644 --- a/apps/presentationeditor/main/app/view/Toolbar.js +++ b/apps/presentationeditor/main/app/view/Toolbar.js @@ -1096,7 +1096,10 @@ define([ if (menuWidth>Common.Utils.innerWidth()) menuWidth = Math.max(Math.floor(Common.Utils.innerWidth()/(itemMargin + itemWidth)), 2) * (itemMargin + itemWidth); var offset = cmp.cmpEl.width() - cmp.openButton.$el.width() - Math.min(menuWidth, buttonOffsetLeft) - 1; - menu.setOffset(Math.min(offset, 0)); + if (Common.UI.isRTL()) { + offset = cmp.openButton.$el.width(); + } + menu.setOffset(Common.UI.isRTL() ? offset : Math.min(offset, 0)); menu.cmpEl.css({ 'width': menuWidth, diff --git a/apps/spreadsheeteditor/main/app/view/Toolbar.js b/apps/spreadsheeteditor/main/app/view/Toolbar.js index df3add848..656e2ff7d 100644 --- a/apps/spreadsheeteditor/main/app/view/Toolbar.js +++ b/apps/spreadsheeteditor/main/app/view/Toolbar.js @@ -1337,7 +1337,10 @@ define([ if (menuWidth>Common.Utils.innerWidth()) menuWidth = Math.max(Math.floor(Common.Utils.innerWidth()/(itemMargin + itemWidth)), 2) * (itemMargin + itemWidth); var offset = cmp.cmpEl.width() - cmp.openButton.$el.width() - Math.min(menuWidth, buttonOffsetLeft) - 1; - menu.setOffset(Math.min(offset, 0)); + if (Common.UI.isRTL()) { + offset = cmp.openButton.$el.width(); + } + menu.setOffset(Common.UI.isRTL() ? offset : Math.min(offset, 0)); menu.cmpEl.css({ 'width': menuWidth,