From 727b344c89f820ef80f3feca1c8ecbc94f86c6b6 Mon Sep 17 00:00:00 2001
From: JuliaSvinareva <Julia.Svinaryova@onlyoffice.com>
Date: Tue, 27 Dec 2022 22:44:58 +0300
Subject: [PATCH] [rtl] Fix toolbar in view and comment mode

---
 apps/common/main/lib/component/Mixtbar.js    |  9 +++++----
 apps/common/main/lib/controller/Plugins.js   |  2 +-
 apps/common/main/resources/less/toolbar.less | 10 ++++++++++
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/apps/common/main/lib/component/Mixtbar.js b/apps/common/main/lib/component/Mixtbar.js
index 1ecf96d83..692d3b43c 100644
--- a/apps/common/main/lib/component/Mixtbar.js
+++ b/apps/common/main/lib/component/Mixtbar.js
@@ -56,7 +56,7 @@ define([
 
         var onScrollTabs = function(opts, e) {
             var sv = $boxTabs.scrollLeft();
-            if ( sv || opts == 'right' ) {
+            if (sv || opts == 'right' || Common.UI.isRTL() && opts == 'left') {
                 $boxTabs.animate({scrollLeft: opts == 'left' ? sv - 100 : sv + 100}, 200);
             }
         };
@@ -412,6 +412,7 @@ define([
                     if ( $active && $active.length ) {
                         var _maxright = $active.parents('.box-controls').width(),
                             _staticPanelWidth = $active.parents('.box-controls').find('.panel.static').outerWidth();
+                        if (!_staticPanelWidth) _staticPanelWidth = 0;
                         var data = $active.data(),
                             _rightedge = data.rightedge,
                             _btns = data.buttons,
@@ -444,7 +445,6 @@ define([
                                 if (_flex.length>0) {
                                     for (var i=0; i<_flex.length; i++) {
                                         var item = _flex[i].el;
-                                        //_rightedge = $active.get(0).getBoundingClientRect().right;
                                         _rightedge = $active.outerWidth() + _staticPanelWidth;
                                         if (item.outerWidth() > parseInt(item.css('min-width'))) {
                                             data.rightedge = _rightedge;
@@ -574,8 +574,9 @@ define([
                 var more_section_width = parseInt(more_section.css('width')) || 0,
                     box_controls_width = $active.parents('.box-controls').width(),
                     _staticPanelWidth = $active.parents('.box-controls').find('.panel.static').outerWidth(),
-                    _maxright = box_controls_width,
-                    _rightedge = $active.outerWidth() + _staticPanelWidth,
+                    _maxright = box_controls_width;
+                if (!_staticPanelWidth) _staticPanelWidth = 0;
+                var _rightedge = $active.outerWidth() + _staticPanelWidth,
                     delta = (this._prevBoxWidth) ? (_maxright - this._prevBoxWidth) : -1,
                     hideAllMenus = false;
                 this._prevBoxWidth = _maxright;
diff --git a/apps/common/main/lib/controller/Plugins.js b/apps/common/main/lib/controller/Plugins.js
index 8b589d926..2cd7d2b91 100644
--- a/apps/common/main/lib/controller/Plugins.js
+++ b/apps/common/main/lib/controller/Plugins.js
@@ -263,7 +263,7 @@ define([
                     } else {
                         _group.appendTo(me.$toolbarPanelPlugins);
                         $('<div class="separator long invisible"></div>').appendTo(me.$toolbarPanelPlugins);
-                        _group = $('<div class="group" style="padding-left: 0;"></div>');
+                        _group = $('<div class="group" style="' + (Common.UI.isRTL() ? 'padding-right: 0;' : 'padding-left: 0;') + '"></div>');
                     }
 
                     var btn = me.panelPlugins.createPluginButton(model);
diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less
index b86a58eb6..201fcd2fd 100644
--- a/apps/common/main/resources/less/toolbar.less
+++ b/apps/common/main/resources/less/toolbar.less
@@ -169,6 +169,11 @@
                 &:after {
                     transform: rotate(135deg);
                     margin-left: 8px;
+
+                    .rtl & {
+                        margin-left: 0;
+                        margin-right: 4px;
+                    }
                 }
             }
             &.right{
@@ -178,6 +183,11 @@
                 &:after {
                     transform: rotate(-45deg);
                     margin-left: 4px;
+
+                    .rtl & {
+                        margin-left: 0;
+                        margin-right: 8px;
+                    }
                 }
             }