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

Merge pull request #1967 from ONLYOFFICE/feature/for-rtl

Browse source 
Feature/for rtl
This commit is contained in:
JuliaSvinareva 2022-09-19 16:31:42 +03:00 committed by GitHub
parent cc7248f51d 82a5411b8c
commit 9ecd26958a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 174 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
apps/common/main/lib/component/ComboBorderSize.js
View file

@ -244,10 +244,10 @@ define([
'</button>',
'<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
'<% _.each(items, function(item) { %>',
'<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem" style="padding: 2px 0 2px 10px;">',
'<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem">',
'<span style="margin-top: 0;"></span>',
'<% if (item.offsety!==undefined) { %>',
'<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" align="left" style="background-position: 0 -<%= item.offsety %>px;">',
'<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" style="background-position: 0 -<%= item.offsety %>px;">',
'<% } %>',
'</a></li>',
'<% }); %>',
@ -300,9 +300,9 @@ define([
Common.UI.ComboBoxColor = Common.UI.ComboBox.extend(_.extend({
template: _.template([
'<div class="input-group combobox combo-color input-group-nr <%= cls %>" id="<%= id %>" style="<%= style %>">',
'<div class="form-control" style="padding:2px 14px 2px 3px; <%= style %> display: block;">',
'<div style="display: inline-block;overflow: hidden;width: 100%;height: 100%;"></div>',
'<div class="input-group combobox combo-color combobox-color input-group-nr <%= cls %>" id="<%= id %>" style="<%= style %>">',
'<div class="form-control" style="<%= style %>">',
'<div></div>',
'</div>',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">',
'<span class="caret"></span>',
@ -313,7 +313,7 @@ define([
'<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
'<% } else { %>',
'<li id="<%= item.id %>" data-value="<%= item.value %>">',
'<a tabindex="-1" type="menuitem" style="padding: 5px;"><div style="height: 15px;<%= item.styleStr %>"><%= scope.getDisplayValue(item) %></div></a>',
'<a tabindex="-1" type="menuitem"><div style="<%= item.styleStr %>"><%= scope.getDisplayValue(item) %></div></a>',
'</li>',
'<% } %>',
'<% }); %>',
@ -380,7 +380,7 @@ define([
'<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
'<% } else { %>',
'<li id="<%= item.id %>" data-value="<%= item.value %>">',
'<a tabindex="-1" type="menuitem" style="padding: 5px;"><div style="height: 15px;<%= item.styleStr %>"><%= scope.getDisplayValue(item) %></div></a>',
'<a tabindex="-1" type="menuitem""><div style="<%= item.styleStr %>"><%= scope.getDisplayValue(item) %></div></a>',
'</li>',
'<% } %>',
'<% }); %>'
@ -407,9 +407,9 @@ define([
Common.UI.ComboBoxIcons= Common.UI.ComboBox.extend(_.extend({
template: _.template([
'<div class="input-group combobox combo-color input-group-nr <%= cls %>" id="<%= id %>" style="<%= style %>">',
'<div class="form-control" style="padding:2px 0 2px 3px; <%= style %> display: block;">',
'<div style="display: inline-block;overflow: hidden;width: 100%;height: 100%;"></div>',
'<div class="input-group combobox combobox-icons combo-color input-group-nr <%= cls %>" id="<%= id %>" style="<%= style %>">',
'<div class="form-control" style="<%= style %>">',
'<div></div>',
'</div>',
'<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">',
'<span class="caret"></span>',
@ -420,9 +420,9 @@ define([
'<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
'<% } else { %>',
'<li id="<%= item.id %>" data-value="<%= item.value %>">',
'<a tabindex="-1" type="menuitem" style="padding: 5px;">',
'<a tabindex="-1" type="menuitem">',
'<% _.each(item.data.iconSet, function(icon) { %>',
'<img src="<%= item.data.icons.at(icon-1).get(\'icon\') %>" style="width:16px;height:16px;margin-right: 5px;">',
'<img src="<%= item.data.icons.at(icon-1).get(\'icon\') %>">',
'<% }) %>',
'</a>',
'</li>',
@ -454,7 +454,7 @@ define([
if (record.get('value')!=-1) {
var str = '';
_.each(record.get('data').iconSet, function(icon) {
str += '<img src="' + record.get('data').icons.at(icon-1).get("icon") + '" style="width:16px;height:16px;margin-right: 5px;">';
str += '<img src="' + record.get('data').icons.at(icon-1).get("icon") + '">';
});
formcontrol[0].innerHTML = str;
formcontrol.css({'margin-top': '0'});
@ -495,7 +495,7 @@ define([
'<li id="<%= item.id %>" data-value="<%= item.value %>">',
'<a tabindex="-1" type="menuitem" style="padding: 5px;">',
'<% _.each(item.data.iconSet, function(icon) { %>',
'<img src="<%= item.data.icons.at(icon-1).get(\'icon\') %>" style="width:16px;height:16px;margin-right: 5px;">',
'<img src="<%= item.data.icons.at(icon-1).get(\'icon\') %>">',
'<% }) %>',
'</a>',
'</li>',

4
apps/common/main/resources/less/buttons.less
View file

@ -249,6 +249,10 @@
.caret {
margin: 0 1px 0 4px;
.rtl & {
margin: 0 4px 0 1px;
}
}
}
}

10
apps/common/main/resources/less/combo-border-size.less
View file

@ -14,6 +14,11 @@
li {
a {
white-space: normal;
padding: 2px 0 2px 10px;
.rtl & {
padding: 2px 10px 2px 0;
}
}
span {
@ -28,6 +33,11 @@
height:20px;
background-color: transparent;
image-rendering: pixelated;
float: left;
.rtl & {
float: right;
}
}
}

93
apps/common/main/resources/less/combobox.less
View file

@ -18,10 +18,27 @@
border-top-right-radius: 2px !important;
border-bottom-right-radius: 2px !important;
.rtl & {
border-top-left-radius: 2px !important;
border-bottom-left-radius: 2px !important;
}
}
&.input-group-nr > .btn {
.rtl & {
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
}
&.input-group-nr > .form-control {
padding-right: 7px + 2 * @padding-base-horizontal;
.rtl & {
padding-right: 3px;
padding-left: 7px + 2 * @padding-base-horizontal;
}
}
.form-control {
@ -39,6 +56,12 @@
line-height: 20px;
padding-left: 2px;
}
.rtl & {
border: @scaled-one-px-value-ie solid @border-regular-control-ie;
border: @scaled-one-px-value solid @border-regular-control;
border-left: 0;
}
}
.btn {
@ -52,6 +75,16 @@
position: absolute;
top: 0;
right: 0;
.rtl & {
border: @scaled-one-px-value-ie solid;
border: @scaled-one-px-value solid;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: 0;
right: unset;
left: 0;
}
}
.btn-default:not(.disabled),
@ -61,6 +94,11 @@
border-color: @border-regular-control-ie;
border-color: @border-regular-control;
padding-right: 5px;
.rtl & {
padding-right: 3px;
padding-left: 5px;
}
}
.btn-default.disabled {
@ -176,6 +214,10 @@
.dropdown-menu.menu-absolute {
position: fixed;
.rtl & {
right: unset;
}
}
.dropdown-menu.show-top {
@ -190,6 +232,57 @@
}
}
}
&.combobox-icons {
.form-control {
padding:2px 0 2px 3px;
display: block;
div {
display: inline-block;
overflow: hidden;
width: 100%;
height: 100%;
}
}
li a {
padding: 5px;
img {
width:16px;
height:16px;
margin-right: 5px;
.rtl & {
margin-right: 0;
margin-left: 5px;
}
}
}
}
&.combobox-color {
.form-control {
display: block;
padding: 2px 14px 2px 3px;
div {
display: inline-block;
overflow: hidden;
width: 100%;
height: 100%;
}
.rtl & {
padding: 2px 3px 2px 14px;
}
}
li a {
padding: 5px;
div {
height: 15px;
}
}
}
}
.open > .combobox.combo-dataview-menu {

13
apps/common/main/resources/less/common.less
View file

@ -247,6 +247,11 @@ label {
color: @text-normal-ie;
color: @text-normal;
}
.rtl & {
left: unset;
right: 0;
}
}
textarea {
@ -312,4 +317,12 @@ body {
&.pixel-ratio__1_75 {
image-rendering: crisp-edges; // FF only
}
}
.rtl .ps-scrollbar-y-rail {
right: unset !important;
left: 1px !important;
.ps-scrollbar-y {
left: 0 !important;
}
}

4
apps/common/main/resources/less/dropdown-menu.less
View file

@ -52,6 +52,10 @@
background-color: @highlight-button-hover-ie;
background-color: @highlight-button-hover;
}
.rtl & {
text-align: right;
}
}
&.over > a {

25
apps/common/main/resources/less/input.less
View file

@ -47,6 +47,11 @@
height: 16px;
background-position: @input-error-offset-x @input-error-offset-y;
filter: none;
.rtl & {
right: unset;
left: 3px;
}
}
}
@ -55,6 +60,10 @@
.input-error {
float: left;
position: relative;
.rtl & {
float: right;
}
}
&.form-control:focus,
@ -134,14 +143,30 @@ textarea.form-control:focus {
height: 20px;
height: calc(22px - @scaled-one-px-value * 2);
}
.rtl & {
right: unset;
left: @scaled-one-px-value-ie;
left: @scaled-one-px-value;
}
}
.input-error {
&:before {
right: 22px;
.rtl & {
right: unset;
left: 22px;
}
}
}
input {
padding-right: 20px;
.rtl & {
padding-right: 3px;
padding-left: 20px;
}
}
}

11
apps/common/main/resources/less/spinner.less
View file

@ -9,6 +9,12 @@
padding-left: 1px;
padding-right: @trigger-width + 2px;
.rtl & {
text-align: left;
padding-left: @trigger-width + 2px;
padding-right: 1px;
}
&:focus {
// border-color: @border-preview-select;
}
@ -46,6 +52,11 @@
border-bottom: @scaled-one-px-value-ie solid transparent;
border-bottom: @scaled-one-px-value solid transparent;
.rtl & {
right: unset;
left: 1px;
}
i {
display: inline-block;
width: 4px;