web-apps/apps/common/main/resources/less/input.less

118 lines
2 KiB
Plaintext
Raw Normal View History

2016-03-11 00:48:53 +00:00
.form-control {
.border-radius(@border-radius-small);
.box-shadow(none);
2020-12-19 19:43:19 +00:00
color: @text-normal;
2016-03-11 00:48:53 +00:00
.user-select(text);
border: 1px solid @border-regular-control;
background-color: @background-normal;
2016-03-11 00:48:53 +00:00
&:focus {
border-color: @border-control-focus;
2016-03-11 00:48:53 +00:00
outline: 0;
.box-shadow(none);
}
}
.form-control[readonly] {
cursor: pointer;
background-color: @background-normal;
2016-03-11 00:48:53 +00:00
}
.form-control[disabled] {
cursor: default;
background-color: @background-normal;
2016-03-11 00:48:53 +00:00
.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 {
2020-12-19 19:43:19 +00:00
border-color: @border-preview-select;
}
2016-03-11 00:48:53 +00:00
&.error {
input:not([disabled]) {
2016-03-11 00:48:53 +00:00
border-color: @brand-danger;
}
input:not([disabled]) + .input-error {
2016-03-11 00:48:53 +00:00
display: block;
}
}
}
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;
}
2019-09-19 09:45:40 +00:00
input[type="text"]::selection, textarea::selection {
2020-12-19 19:43:19 +00:00
background: @highlight-text-select;
color: @text-inverse;
2019-09-19 09:45:40 +00:00
}
textarea.form-control:focus {
2020-12-19 19:43:19 +00:00
border-color: @border-preview-select;
2020-04-06 11:57:26 +00:00
}
.input-field-btn {
position: relative;
2020-04-06 11:57:26 +00:00
.select-button {
position: absolute;
top: 1px;
right: 1px;
}
.input-error {
&:before {
right: 22px;
}
}
2020-04-21 17:13:03 +00:00
input {
padding-right: 20px;
}
}