77 lines
1.6 KiB
Text
77 lines
1.6 KiB
Text
|
.hover(@color: @input-hover-border-color) {
|
||
|
|
border-color: tint(@color, 20%);
|
||
|
|
}
|
||
|
|
|
||
|
|
.active(@color: @input-hover-border-color) {
|
||
|
|
border-color: tint(@color, 20%);
|
||
|
|
outline: 0;
|
||
|
|
box-shadow: 0 0 0 2px fade(@color, 20%);
|
||
|
|
}
|
||
|
|
|
||
|
|
.disabled() {
|
||
|
|
background-color: @input-disabled-bg;
|
||
|
|
opacity: 1;
|
||
|
|
cursor: @cursor-disabled;
|
||
|
|
color: #ccc;
|
||
|
|
&:hover {
|
||
|
|
.hover(@input-border-color);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.input-large() {
|
||
|
|
padding: @input-padding-vertical-large @input-padding-horizontal;
|
||
|
|
height: @input-height-large;
|
||
|
|
}
|
||
|
|
|
||
|
|
.input-small() {
|
||
|
|
padding: @input-padding-vertical-small @input-padding-horizontal;
|
||
|
|
height: @input-height-small;
|
||
|
|
border-radius: @border-radius-small;
|
||
|
|
}
|
||
|
|
|
||
|
|
.input() {
|
||
|
|
display: inline-block;
|
||
|
|
width: 100%;
|
||
|
|
height: @input-height-base;
|
||
|
|
line-height: @line-height-base;
|
||
|
|
padding: @input-padding-vertical-base @input-padding-horizontal;
|
||
|
|
font-size: @font-size-base;
|
||
|
|
border: 1px solid @input-border-color;
|
||
|
|
border-radius: @border-radius-base;
|
||
|
|
color: @input-color;
|
||
|
|
background-color: @input-bg;
|
||
|
|
background-image: none;
|
||
|
|
position: relative;
|
||
|
|
cursor: text;
|
||
|
|
.placeholder();
|
||
|
|
.transition3(border @transition-time @ease-in-out, background @transition-time @ease-in-out, box-shadow @transition-time @ease-in-out);
|
||
|
|
|
||
|
|
&:hover {
|
||
|
|
.hover();
|
||
|
|
}
|
||
|
|
|
||
|
|
&:focus {
|
||
|
|
.active();
|
||
|
|
}
|
||
|
|
|
||
|
|
&[disabled],
|
||
|
|
fieldset[disabled] & {
|
||
|
|
.disabled();
|
||
|
|
}
|
||
|
|
|
||
|
|
// Reset height for textarea
|
||
|
|
textarea& {
|
||
|
|
max-width: 100%;
|
||
|
|
height: auto;
|
||
|
|
vertical-align: bottom;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Size
|
||
|
|
&-large {
|
||
|
|
.input-large();
|
||
|
|
}
|
||
|
|
|
||
|
|
&-small {
|
||
|
|
.input-small();
|
||
|
|
}
|
||
|
|
}
|