[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>', '</button>',
'<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">', '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
'<% _.each(items, function(item) { %>', '<% _.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>', '<span style="margin-top: 0;"></span>',
'<% if (item.offsety!==undefined) { %>', '<% 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>', '</a></li>',
'<% }); %>', '<% }); %>',

View file

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

View file

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

View file

@ -18,10 +18,27 @@
border-top-right-radius: 2px !important; border-top-right-radius: 2px !important;
border-bottom-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 { &.input-group-nr > .form-control {
padding-right: 7px + 2 * @padding-base-horizontal; padding-right: 7px + 2 * @padding-base-horizontal;
.rtl & {
padding-right: 3px;
padding-left: 7px + 2 * @padding-base-horizontal;
}
} }
.form-control { .form-control {
@ -39,6 +56,12 @@
line-height: 20px; line-height: 20px;
padding-left: 2px; 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 { .btn {
@ -52,6 +75,16 @@
position: absolute; position: absolute;
top: 0; top: 0;
right: 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), .btn-default:not(.disabled),
@ -61,6 +94,11 @@
border-color: @border-regular-control-ie; border-color: @border-regular-control-ie;
border-color: @border-regular-control; border-color: @border-regular-control;
padding-right: 5px; padding-right: 5px;
.rtl & {
padding-right: 3px;
padding-left: 5px;
}
} }
.btn-default.disabled { .btn-default.disabled {

View file

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

View file

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