[rtl] Fix input and combobox components

This commit is contained in:
JuliaSvinareva 2022-09-14 21:22:52 +03:00
parent cc7248f51d
commit aa35384d5e
6 changed files with 83 additions and 2 deletions

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>',
'<% }); %>',

View file

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

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;
}
}
}

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 {

View file

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

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;
}
}
}