web-apps/apps/common/main/resources/less/input.less
2020-12-25 14:50:01 +03:00

127 lines
2.1 KiB
Plaintext

.form-control {
.border-radius(@border-radius-small);
.box-shadow(none);
color: @gray-deep;
.user-select(text);
&:focus {
border-color: @input-border;
outline: 0;
.box-shadow(none);
}
}
.form-control[readonly] {
cursor: pointer;
background-color: @input-bg;
}
.form-control[disabled] {
cursor: default;
background-color: @input-bg;
.user-select(none);
}
.input-row {
position: relative;
}
.input-error {
display: none;
&:before {
content: '';
position: absolute;
right: 3px;
top: 4px;
width: 16px;
height: 16px;
background-position: @input-error-offset-x @input-error-offset-y;
}
}
.input-field {
input,
.input-error {
float: left;
position: relative;
}
&.form-control:focus,
.form-control:focus {
border-color: @gray-darker;
}
&.error {
input:not([disabled]) {
border-color: @brand-danger;
}
input:not([disabled]) + .input-error {
display: block;
}
}
&.warning {
input:not([disabled]) + .input-error {
display: block;
}
.input-error {
&:before {
background-position: @input-warning-offset-x @input-warning-offset-y;
}
}
}
}
input:required:focus:invalid,
input:focus:invalid,
input.error {
border-color: @brand-danger;
& + span.input-error {
display: block;
}
}
.disabled .form-control {
opacity: 0.65;
cursor: default !important;
}
::-ms-clear {
display: none;
}
input[type="password"] {
font-size: 16px;
}
input[type="text"]::selection, textarea::selection {
background: #3494fb;
color: white;
}
textarea.form-control:focus {
border-color: @gray-darker;
}
.input-field-btn {
position: relative;
.select-button {
position: absolute;
top: 1px;
right: 1px;
}
.input-error {
&:before {
right: 22px;
}
}
input {
padding-right: 20px;
}
}