From 8cf3b498d62fa7ffe29c89dcb0bdf06a5fe22cd3 Mon Sep 17 00:00:00 2001
From: JuliaSvinareva <Julia.Svinaryova@onlyoffice.com>
Date: Thu, 3 Nov 2022 20:29:58 +0300
Subject: [PATCH] [rtl] Fix advanced settings for PE

---
 .../template/ImageSettingsAdvanced.template   |  4 +-
 .../ParagraphSettingsAdvanced.template        | 26 ++++-----
 .../template/ShapeSettingsAdvanced.template   |  4 +-
 .../resources/less/advanced-settings.less     | 54 +++++++++++++++++++
 4 files changed, 71 insertions(+), 17 deletions(-)

diff --git a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template
index bd32ccc50..74c05616f 100644
--- a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template
+++ b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template
@@ -58,7 +58,7 @@
     <div class="inner-content  padding-large">
         <div style="width: 100%;">
             <label class="input-label"><%= scope.textAngle %></label>
-            <div id="image-advanced-spin-angle" style="display: inline-block; margin-left: 5px;"></div>
+            <div id="image-advanced-spin-angle" style="display: inline-block;"></div>
         </div>
     </div>
     <div class="separator horizontal padding-large"></div>
@@ -66,7 +66,7 @@
         <table cols="2">
             <tr>
                 <td rowspan="2" class="padding-small" style="vertical-align: top;">
-                    <label class="input-label" style="margin-right: 15px;vertical-align: top;"><%= scope.textFlipped %></label>
+                    <label class="input-label flipped" style="vertical-align: top;"><%= scope.textFlipped %></label>
                 </td>
                 <td class="padding-small">
                     <div id="image-advanced-checkbox-hor"></div>
diff --git a/apps/presentationeditor/main/app/template/ParagraphSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ParagraphSettingsAdvanced.template
index 397e41ebd..fb2079162 100644
--- a/apps/presentationeditor/main/app/template/ParagraphSettingsAdvanced.template
+++ b/apps/presentationeditor/main/app/template/ParagraphSettingsAdvanced.template
@@ -8,11 +8,11 @@
         </div>
         <div class="padding-very-small"><label class="header"><%= scope.strIndent %></label></div>
         <div>
-            <div class="padding-large" style="display: inline-block;margin-right: 3px;">
+            <div class="padding-large margin-right" style="display: inline-block;">
                 <label class="input-label"><%= scope.strIndentsLeftText %></label>
                 <div id="paragraphadv-spin-indent-left"></div>
             </div><!--
-         --><div class="padding-large" style="display: inline-block;margin-right: 3px;">
+         --><div class="padding-large margin-right" style="display: inline-block;">
                 <label class="input-label"><%= scope.strIndentsRightText %></label>
                 <div id="paragraphadv-spin-indent-right"></div>
             </div><!--
@@ -21,18 +21,18 @@
                     <label class="input-label"><%= scope.strIndentsSpecial %></label>
                 </div>
                 <div>
-                    <div id="paragraphadv-spin-special" style="display: inline-block;margin-right: 3px;"></div><!--
+                    <div id="paragraphadv-spin-special" class="margin-right" style="display: inline-block;"></div><!--
                  --><div id="paragraphadv-spin-special-by" style="display: inline-block;"></div>
                 </div>
             </div>
         </div>
         <div class="padding-very-small"><label class="header"><%= scope.strSpacing %></label></div>
         <div>
-            <div style="display: inline-block;margin-right: 3px;">
+            <div class="margin-right" style="display: inline-block;">
                 <label class="input-label"><%= scope.strIndentsSpacingBefore %></label>
                 <div id="paragraphadv-spin-spacing-before"></div>
             </div><!--
-         --><div style="display: inline-block;margin-right: 3px;">
+         --><div class="margin-right" style="display: inline-block;">
                 <label class="input-label"><%= scope.strIndentsSpacingAfter %></label>
                 <div id="paragraphadv-spin-spacing-after"></div>
             </div><!--
@@ -41,7 +41,7 @@
                     <label class="input-label"><%= scope.strIndentsLineSpacing %></label>
                 </div>
                 <div>
-                    <div id="paragraphadv-spin-line-rule" style="display: inline-block;margin-right: 3px;"></div><!--
+                    <div id="paragraphadv-spin-line-rule" class="margin-right" style="display: inline-block;"></div><!--
                  --><div id="paragraphadv-spin-line-height" style="display: inline-block;"></div>
                 </div>
             </div>
@@ -63,7 +63,7 @@
                 <td class="padding-small">
                     <div id="paragraphadv-checkbox-strike"></div>
                 </td>
-                <td class="padding-small" style="padding-left: 40px;">
+                <td class="padding-small padding-left">
                     <div id="paragraphadv-checkbox-subscript"></div>
                 </td>
             </tr>
@@ -71,7 +71,7 @@
                 <td class="padding-small">
                     <div id="paragraphadv-checkbox-double-strike"></div>
                 </td>
-                <td class="padding-small" style="padding-left: 40px;">
+                <td class="padding-small padding-left">
                     <div id="paragraphadv-checkbox-small-caps"></div>
                 </td>
             </tr>
@@ -79,7 +79,7 @@
                 <td class="padding-large">
                     <div id="paragraphadv-checkbox-superscript"></div>
                 </td>
-                <td class="padding-large" style="padding-left: 40px;">
+                <td class="padding-large padding-left">
                     <div id="paragraphadv-checkbox-all-caps"></div>
                 </td>
             </tr>
@@ -105,11 +105,11 @@
 
         </div>
         <div>
-            <div class="padding-large" style="display: inline-block; margin-right: 9px;">
+            <div class="padding-large margin-right" style="display: inline-block;">
                 <label class="input-label"><%= scope.textTabPosition %></label>
                 <div id="paraadv-spin-tab"></div>
             </div>
-            <div class="padding-large" style=" display: inline-block; margin-right: 9px;">
+            <div class="padding-large margin-right" style=" display: inline-block;">
                 <label class="input-label"><%= scope.textAlign %></label>
                 <div id="paraadv-cmb-align"></div>
             </div>
@@ -120,8 +120,8 @@
             </div>
         </div>
         <div>
-            <button type="button" class="btn btn-text-default" id="paraadv-button-add-tab" style="width:108px;margin-right: 9px; display: inline-block;"><%= scope.textSet %></button>
-            <button type="button" class="btn btn-text-default" id="paraadv-button-remove-tab" style="width:108px;margin-right: 9px; display: inline-block;"><%= scope.textRemove %></button>
+            <button type="button" class="btn btn-text-default margin-right" id="paraadv-button-add-tab" style="width:108px; display: inline-block;"><%= scope.textSet %></button>
+            <button type="button" class="btn btn-text-default margin-right" id="paraadv-button-remove-tab" style="width:108px; display: inline-block;"><%= scope.textRemove %></button>
             <button type="button" class="btn btn-text-default" id="paraadv-button-remove-all" style="width:108px;display: inline-block;"><%= scope.textRemoveAll %></button>
         </div>
     </div>
diff --git a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template
index d8da572f2..49b3bc75a 100644
--- a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template
+++ b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template
@@ -56,7 +56,7 @@
     <div class="inner-content  padding-large">
         <div style="width: 100%;">
             <label class="input-label"><%= scope.textAngle %></label>
-            <div id="shape-advanced-spin-angle" style="display: inline-block; margin-left: 5px;"></div>
+            <div id="shape-advanced-spin-angle" style="display: inline-block;"></div>
         </div>
     </div>
     <div class="separator horizontal padding-large"></div>
@@ -64,7 +64,7 @@
         <table cols="2">
             <tr>
                 <td rowspan="2" class="padding-small" style="vertical-align: top;">
-                    <label class="input-label" style="margin-right: 15px;vertical-align: top;"><%= scope.textFlipped %></label>
+                    <label class="input-label flipped" style="vertical-align: top;"><%= scope.textFlipped %></label>
                 </td>
                 <td class="padding-small">
                     <div id="shape-advanced-checkbox-hor"></div>
diff --git a/apps/presentationeditor/main/resources/less/advanced-settings.less b/apps/presentationeditor/main/resources/less/advanced-settings.less
index 7d3cf7c5f..93674bfc6 100644
--- a/apps/presentationeditor/main/resources/less/advanced-settings.less
+++ b/apps/presentationeditor/main/resources/less/advanced-settings.less
@@ -7,4 +7,58 @@
     }
 }
 
+#id-adv-shape-rotate,
+#id-adv-image-rotate {
+    #shape-advanced-spin-angle, #image-advanced-spin-angle {
+        margin-left: 5px;
+
+        .rtl & {
+            margin-left: 0;
+            margin-right: 5px;
+        }
+    }
+
+    .flipped {
+        margin-right: 15px;
+
+        .rtl & {
+            margin-right: 0;
+            margin-left: 15px;
+        }
+    }
+}
+
+#id-adv-paragraph-indents {
+    .margin-right {
+        margin-right: 3px;
+
+        .rtl & {
+            margin-right: 0;
+            margin-left: 3px;
+        }
+    }
+}
+
+#id-adv-paragraph-font {
+    .padding-left {
+        padding-left: 40px;
+
+        .rtl & {
+            padding-left: 0;
+            padding-right: 40px;
+        }
+    }
+}
+
+#id-adv-paragraph-tabs {
+    .margin-right {
+        margin-right: 9px;
+
+        .rtl & {
+            margin-right: 0;
+            margin-left: 9px;
+        }
+    }
+}
+