Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[rtl] Fix advanced settings for DE

Browse source
This commit is contained in:
JuliaSvinareva 2022-11-02 22:38:45 +03:00
parent 3431fb313f
commit 63d796c549
8 changed files with 288 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
apps/common/main/resources/less/advanced-settings-window.less
View file

@ -22,6 +22,11 @@
line-height: normal;
height: auto;
white-space: normal;
.rtl & {
text-align: right;
padding: 9px 12px 9px 2px;
}
}
}

10
apps/common/main/resources/less/window.less
View file

@ -256,6 +256,11 @@
button {
&:not(:first-child) {
margin-left: 10px;
.rtl & {
margin-left: 0;
margin-right: 10px;
}
}
}
}
@ -314,6 +319,11 @@
button {
&:not(:first-child) {
margin-left: 10px;
.rtl & {
margin-left: 0;
margin-right: 10px;
}
}
}
}

20
apps/documenteditor/main/app/template/ImageSettingsAdvanced.template
View file

@ -41,7 +41,7 @@
<td style="vertical-align: bottom; padding-bottom: 19px;">
<div id="shape-radio-hsizepc"></div>
</td>
<td class="padding-large" style="padding-right: 15px;">
<td class="padding-large padding-right">
<label class="input-label"><%= scope.textRelativeWH %></label>
<div id="shape-advanced-spin-width-rel"></div>
</td>
@ -68,7 +68,7 @@
<td style="vertical-align: bottom; padding-bottom: 19px;">
<div id="shape-radio-vsizepc"></div>
</td>
<td class="padding-large" style="padding-right: 15px;">
<td class="padding-large padding-right">
<label class="input-label"><%= scope.textRelativeWH %></label>
<div id="shape-advanced-spin-height-rel"></div>
</td>
@ -94,7 +94,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>
@ -102,7 +102,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>
@ -120,14 +120,14 @@
<div class="inner-content padding-large">
<label class="header padding-small"><%= scope.textWrap %></label>
<div class="padding-small">
<div id="image-advanced-button-wrap-inline" style="display: inline-block; margin-right:7px;"></div>
<div id="image-advanced-button-wrap-square" style="display: inline-block; margin-right:7px;"></div>
<div id="image-advanced-button-wrap-tight" style="display: inline-block; margin-right:7px;"></div>
<div id="image-advanced-button-wrap-through" style="display: inline-block; margin-right:7px;"></div>
<div id="image-advanced-button-wrap-inline" class="margin-right" style="display: inline-block;"></div>
<div id="image-advanced-button-wrap-square" class="margin-right" style="display: inline-block;"></div>
<div id="image-advanced-button-wrap-tight" class="margin-right" style="display: inline-block;"></div>
<div id="image-advanced-button-wrap-through" class="margin-right" style="display: inline-block;"></div>
</div>
<div class="padding-small">
<div id="image-advanced-button-wrap-topbottom" style="display: inline-block; margin-right:7px;"></div>
<div id="image-advanced-button-wrap-infront" style="display: inline-block; margin-right:7px;"></div>
<div id="image-advanced-button-wrap-topbottom" class="margin-right" style="display: inline-block;"></div>
<div id="image-advanced-button-wrap-infront" class="margin-right" style="display: inline-block;"></div>
<div id="image-advanced-button-wrap-behind" style="display: inline-block;"></div>
</div>
</div>

42
apps/documenteditor/main/app/template/ParagraphSettingsAdvanced.template
View file

@ -5,18 +5,18 @@
<label class="input-label"><%= scope.textAlign %></label>
<div id="paragraphadv-spin-text-alignment"></div>
</div>
<div class="padding-large text-only" style="float: right;">
<div class="padding-large text-only outline-level">
<label class="input-label"><%= scope.strIndentsOutlinelevel %></label>
<div id="paragraphadv-spin-outline-level"></div>
</div>
</div>
<div><label class="header padding-very-small"><%= 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><!--
@ -25,18 +25,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><label class="header padding-very-small"><%= 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><!--
@ -45,7 +45,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>
@ -92,7 +92,7 @@
<div style="width: 100%;" class="padding-small">
<label class="input-label"><%= scope.textBorderWidth %></label>
<div id="paragraphadv-combo-border-size" style="display: inline-block; vertical-align: middle; width: 93px;"></div>
<div style="display: inline-block; vertical-align: middle; padding-left: 20px;">
<div class="border-color" style="display: inline-block; vertical-align: middle;">
<label class="input-label" ><%= scope.textBorderColor %></label>
<div id="paragraphadv-border-color-btn" style="display: inline-block;"></div>
</div>
@ -100,7 +100,7 @@
<label class="input-label padding-small" style="width: 100%;"><%= scope.textBorderDesc %></label>
<div style="width: 100%;" class="padding-large">
<div id="id-deparagraphstyler" style="display: inline-block; vertical-align: middle; width: 200px; height: 170px;outline: 1px solid #ccc; margin-top: 2px;"></div>
<div style="display: inline-block; vertical-align: top; width: 76px; text-align: right; height: 170px; padding-top: 0px; margin-left: 9px;">
<div class="border-types" style="display: inline-block; vertical-align: top; width: 76px; height: 170px; padding-top: 0px;">
<div id="paragraphadv-button-border-top" style="display: inline-block;"></div>
<div id="paragraphadv-button-border-inner-hor" style="display: inline-block;"></div>
<div id="paragraphadv-button-border-bottom" style="display: inline-block;"></div>
@ -112,7 +112,7 @@
</div>
</div>
<div style="width: 100%;" class="padding-small">
<label class="input-label" style="margin-right: 5px;"><%= scope.textBackColor %></label>
<label class="input-label back-color"><%= scope.textBackColor %></label>
<div id="paragraphadv-back-color-btn" style="display: inline-block;"></div>
</div>
</div>
@ -127,7 +127,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>
@ -135,7 +135,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>
@ -143,7 +143,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>
@ -156,7 +156,7 @@
<label class="input-label"><%= scope.textSpacing %></label>
<div id="paragraphadv-spin-spacing"></div>
</div>
<div class="text-only" style="display: inline-block; margin-left: 15px;">
<div class="text-only position" style="display: inline-block;">
<label class="input-label"><%= scope.textPosition %></label>
<div id="paragraphadv-spin-position"></div>
</div>
@ -166,7 +166,7 @@
</div>
<div class="padding-large">
<label class="input-label"><%= scope.textLigatures %></label>
<div id="paragraphadv-cmb-ligatures" style="display: inline-block; vertical-align: baseline; margin-left: 5px;"></div>
<div id="paragraphadv-cmb-ligatures" class="ligatures" style="display: inline-block; vertical-align: baseline;"></div>
</div>
<div class="doc-content-color" style="outline: 1px solid #cbcbcb;">
<div id="paragraphadv-font-img" style="width: 300px; height: 80px; position: relative; margin: 0 auto;"></div>
@ -181,11 +181,11 @@
</div>
<div>
<div class="padding-large" style="display: inline-block; margin-right: 8px;">
<div class="padding-large tab-position" 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>
@ -200,8 +200,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>
@ -213,7 +213,7 @@
<label class="input-label"><%= scope.textTop %></label>
<div id="paraadv-number-margin-top"></div>
</div>
<div class="padding-small" style="display: inline-block; padding-left: 15px;">
<div class="padding-small padding-left" style="display: inline-block;">
<label class="input-label"><%= scope.textLeft %></label>
<div id="paraadv-number-margin-left"></div>
</div>
@ -223,7 +223,7 @@
<label class="input-label"><%= scope.textBottom %></label>
<div id="paraadv-number-margin-bottom"></div>
</div>
<div class="padding-small" style="display: inline-block; padding-left: 15px;">
<div class="padding-small padding-left" style="display: inline-block;">
<label class="input-label"><%= scope.textRight %></label>
<div id="paraadv-number-margin-right"></div>
</div>

22
apps/documenteditor/main/app/template/TableSettingsAdvanced.template
View file

@ -12,7 +12,7 @@
</td>
<td class="padding-small">
<label class="input-label"><%= scope.textWidth %></label>
<div id="tableadv-number-width" style="margin-right: 10px;"></div>
<div id="tableadv-number-width" class="margin-right"></div>
</td>
<td class="padding-small">
<label class="input-label"><%= scope.textMeasure %></label>
@ -88,7 +88,7 @@
</td>
<td class="padding-large">
<label class="input-label"><%= scope.textPrefWidth %></label>
<div id="tableadv-number-prefwidth" style="margin-right: 10px;"></div>
<div id="tableadv-number-prefwidth" class="margin-right"></div>
</td>
<td class="padding-large">
<label class="input-label"><%= scope.textMeasure %></label>
@ -147,18 +147,18 @@
<div id="id-adv-table-wrap" class="settings-panel">
<div class="inner-content padding-large">
<label class="header padding-small" style="display: block;"><%= scope.textWrappingStyle %></label>
<div id="tableadv-button-wrap-none" style="display: inline-block; margin-right:5px;"></div>
<div id="tableadv-button-wrap-parallel" style="display: inline-block; margin-right:5px;"></div>
<div id="tableadv-button-wrap-none" class="margin-right" style="display: inline-block;"></div>
<div id="tableadv-button-wrap-parallel" class="margin-right" style="display: inline-block;"></div>
</div>
<div class="padding-small"></div>
<div class="inner-content">
<div id="tableadv-panel-align" style="width: 100%;">
<label class="header padding-small"><%= scope.textAlign %></label>
<div class="padding-large">
<div id="tableadv-button-align-left" style="display: inline-block; margin-right:5px;"></div>
<div id="tableadv-button-align-center" style="display: inline-block; margin-right:5px;"></div>
<div id="tableadv-button-align-right" style="display: inline-block; margin-right:5px;"></div>
<div style="display: inline-block; vertical-align: bottom; margin-left: 20px; margin-bottom: 1px;">
<div id="tableadv-button-align-left" class="margin-right" style="display: inline-block;"></div>
<div id="tableadv-button-align-center" class="margin-right" style="display: inline-block;"></div>
<div id="tableadv-button-align-right" class="margin-right" style="display: inline-block;"></div>
<div class="number-indent" style="display: inline-block; vertical-align: bottom; margin-bottom: 1px;">
<label class="input-label" style="display: block;"><%= scope.textIndLeft %></label>
<div id="tableadv-number-indent"></div>
</div>
@ -200,7 +200,7 @@
<div style="width: 100%;">
<label class="input-label"><%= scope.textBorderWidth %></label>
<div id="tableadv-combo-border-size" style="display: inline-block; vertical-align: middle; width: 93px;"></div>
<div style="display: inline-block; float:right;vertical-align: middle;">
<div class="border-color" style="display: inline-block; vertical-align: middle;">
<label class="input-label" ><%= scope.textBorderColor %></label>
<div id="tableadv-border-color-btn" style="display: inline-block;"></div>
</div>
@ -210,7 +210,7 @@
<label class="input-label padding-large" style="width: 100%;"><%= scope.textBorderDesc %></label>
<div id="tableadv-panel-borders" style="width: 100%;" class="padding-large">
<div id="id-detablestyler" style="display: inline-block; vertical-align: middle; width: 200px; height: 200px;outline: 1px solid #ccc;"></div>
<div style="display: inline-block; vertical-align: middle; width: 76px; height: 200px; padding-top: 10px; padding-left: 10px;">
<div class="border-types" style="display: inline-block; vertical-align: middle; width: 76px; height: 200px; padding-top: 10px;">
<div id="tableadv-button-border-all"></div>
<div id="tableadv-button-border-none"></div>
<div id="tableadv-button-border-inner"></div>
@ -236,7 +236,7 @@
<div id="tableadv-button-back-color" style="display: inline-block;"></div>
</div>
<div id="tableadv-panel-table-back" style="display: inline-block;">
<label class="input-label" style="margin-right: 5px;"><%= scope.textTableBackColor %></label>
<label class="input-label back-color"><%= scope.textTableBackColor %></label>
<div id="tableadv-button-table-back-color" style="display: inline-block;"></div>
</div>
</div>

1
apps/documenteditor/main/app/view/ParagraphSettingsAdvanced.js
View file

@ -411,7 +411,6 @@ define([ 'text!documenteditor/main/app/template/ParagraphSettingsAdvanced.tem
_.each(_arrBorderPresets, function(item, index, list){
var _btn = new Common.UI.Button({
parentEl: $('#'+item[2]),
style: 'margin-left: 4px; margin-bottom: 4px;',
cls: 'btn-options large border-off',
iconCls: item[1],
strId :item[0],

1
apps/documenteditor/main/app/view/TableSettingsAdvanced.js
View file

@ -948,7 +948,6 @@ define([ 'text!documenteditor/main/app/template/TableSettingsAdvanced.templat
_.each(_arrBorderPresets, function(item, index, list){
var _btn = new Common.UI.Button({
parentEl: $('#'+item[2]),
style: 'margin-left: 4px; margin-bottom: 4px;',
cls: 'btn-options large border-off',
iconCls: item[1],
strId :item[0],

231
apps/documenteditor/main/resources/less/advanced-settings.less
View file

@ -72,4 +72,235 @@
#id-text-table-spn-fixed, #bookmarks-radio-location {
display: inline-block;
vertical-align: middle;
}
#id-adv-paragraph-indents {
.outline-level {
float: right;
.rtl & {
float: left;
}
}
.margin-right {
margin-right: 3px;
.rtl & {
margin-right: 0;
margin-left: 3px;
}
}
}
#id-adv-paragraph-borders {
.border-color {
padding-left: 20px;
.rtl & {
padding-left: 0;
padding-right: 20px;
}
}
.back-color {
margin-right: 5px;
.rtl & {
margin-right: 0;
margin-left: 5px;
}
}
.border-types {
text-align: right;
margin-left: 9px;
.rtl & {
text-align: left;
margin-left: 0;
margin-right: 9px;
}
.btn {
margin-left: 4px;
margin-bottom: 4px;
.rtl & {
margin-left: 0;
margin-right: 4px;
}
}
}
}
#id-adv-paragraph-font {
.padding-left {
padding-left: 40px;
.rtl & {
padding-left: 0;
padding-right: 40px;
}
}
.position {
margin-left: 15px;
.rtl & {
margin-left: 0;
margin-right: 15px;
}
}
.ligatures {
margin-left: 5px;
.rtl & {
margin-left: 0;
margin-right: 5px;
}
}
}
#id-adv-paragraph-tabs {
.tab-position {
margin-right: 8px;
.rtl & {
margin-right: 0;
margin-left: 8px;
}
}
.margin-right {
margin-right: 9px;
.rtl & {
margin-right: 0;
margin-left: 9px;
}
}
}
#id-adv-paragraph-margins {
.padding-left {
padding-left: 15px;
.rtl & {
padding-left: 0;
padding-right: 15px;
}
}
}
#id-adv-table-width, #id-adv-table-cell-props {
.margin-right {
margin-right: 10px;
.rtl & {
margin-right: 0;
margin-left: 10px;
}
}
}
#id-adv-table-borders {
.border-color {
float: right;
.rtl & {
float: left;
}
}
.border-types {
padding-left: 10px;
.rtl & {
padding-left: 0;
padding-right: 10px;
}
.btn {
margin-left: 4px;
margin-bottom: 4px;
.rtl & {
margin-left: 0;
margin-right: 4px;
}
}
}
.back-color {
margin-right: 5px;
.rtl & {
margin-right: 0;
margin-left: 5px;
}
}
}
#id-adv-table-wrap {
.margin-right {
margin-right: 5px;
.rtl & {
margin-right: 0;
margin-left: 5px;
}
}
.number-indent {
margin-left: 20px;
.rtl & {
margin-left: 0;
margin-right: 20px;
}
}
}
#id-adv-image-rotate {
#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-image-wrap {
.margin-right {
margin-right: 7px;
.rtl & {
margin-right: 0;
margin-left: 7px;
}
}
}
#id-adv-shape-size {
.padding-right {
padding-right: 15px;
.rtl & {
padding-right: 0;
padding-left: 15px;
}
}
}