272 lines
4.2 KiB
Plaintext
272 lines
4.2 KiB
Plaintext
@import "variable.less"; // Variable.less
|
|
|
|
/* Input Style
|
|
------------------------*/
|
|
|
|
.form-group {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.form-control {
|
|
height: 42px;
|
|
border-radius: 0px;
|
|
box-shadow: none;
|
|
border-color: @border;
|
|
font-family: @mol;
|
|
&:hover {
|
|
box-shadow: none;
|
|
border-color: @border;
|
|
}
|
|
&:focus,
|
|
&.active {
|
|
box-shadow: none;
|
|
border-color: @default;
|
|
}
|
|
}
|
|
|
|
.input-default {
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.input-flat {
|
|
border-radius: 0px;
|
|
}
|
|
|
|
.input-rounded {
|
|
border-radius: 100px;
|
|
}
|
|
|
|
.input-focus {
|
|
border-color: @primary;
|
|
&:focus {
|
|
border-color: @primary;
|
|
}
|
|
}
|
|
|
|
|
|
/* Search Box Input Button
|
|
--------------------------------*/
|
|
|
|
.input-group-btn {
|
|
.btn {
|
|
padding: 10px 12px;
|
|
}
|
|
}
|
|
|
|
.input-group-default {
|
|
.form-control {
|
|
border-radius: 4px;
|
|
}
|
|
}
|
|
|
|
.input-group-flat {
|
|
.form-control {
|
|
border-radius: 4px;
|
|
}
|
|
.btn {
|
|
border-radius: 0px;
|
|
border-radius: 0px;
|
|
}
|
|
}
|
|
|
|
.input-group-rounded {
|
|
.form-control {
|
|
border-radius: 100px;
|
|
}
|
|
.btn-group-left {
|
|
border-top-left-radius: 100px;
|
|
border-bottom-left-radius: 100px;
|
|
}
|
|
.btn-group-right {
|
|
border-top-right-radius: 100px;
|
|
border-bottom-right-radius: 100px;
|
|
}
|
|
}
|
|
|
|
.input-group-close-icon {
|
|
background: none;
|
|
color: @black;
|
|
border-color: @border;
|
|
// border-left: 1px solid @white;
|
|
&:hover,
|
|
&:focus,
|
|
&.active {
|
|
background: none;
|
|
border-color: @border;
|
|
color: @black;
|
|
}
|
|
}
|
|
|
|
|
|
/* Input States
|
|
-----------------------*/
|
|
|
|
.has-default,
|
|
.has-success,
|
|
.has-warning,
|
|
.has-error {
|
|
.form-control {
|
|
&:hover,
|
|
&:focus,
|
|
&.active {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.has-default {
|
|
.control-label {
|
|
color: @default;
|
|
}
|
|
.form-control {
|
|
border-color: @default;
|
|
&:hover,
|
|
&:focus,
|
|
&.active {
|
|
border-color: @default;
|
|
}
|
|
}
|
|
}
|
|
|
|
.has-success {
|
|
.control-label {
|
|
color: @success;
|
|
}
|
|
.form-control {
|
|
border-color: @success;
|
|
&:hover,
|
|
&:focus,
|
|
&.active {
|
|
border-color: @success;
|
|
}
|
|
}
|
|
}
|
|
|
|
.has-warning {
|
|
.control-label {
|
|
color: @warning;
|
|
}
|
|
.form-control {
|
|
border-color: @warning;
|
|
&:hover,
|
|
&:focus,
|
|
&.active {
|
|
border-color: @warning;
|
|
}
|
|
}
|
|
}
|
|
|
|
.has-error {
|
|
.control-label {
|
|
color: @danger;
|
|
}
|
|
.form-control {
|
|
border-color: @danger;
|
|
&:hover,
|
|
&:focus,
|
|
&.active {
|
|
border-color: @danger;
|
|
}
|
|
}
|
|
}
|
|
|
|
.has-feedback label ~ .form-control-feedback {
|
|
top: 35px;
|
|
}
|
|
|
|
.form-horizontal .has-feedback .form-control-feedback {
|
|
top: 5px;
|
|
}
|
|
|
|
.has-success {
|
|
.form-control-feedback {
|
|
color: @success;
|
|
}
|
|
}
|
|
|
|
.has-warning {
|
|
.form-control-feedback {
|
|
color: @warning;
|
|
}
|
|
}
|
|
|
|
.has-error {
|
|
.form-control-feedback {
|
|
color: @danger;
|
|
}
|
|
}
|
|
|
|
.has-success .input-group-addon {
|
|
background-color: lighten(@success, 25%);
|
|
border-color: @success;
|
|
color: @success;
|
|
}
|
|
|
|
.has-warning .input-group-addon {
|
|
background-color: lighten(@warning, 25%);
|
|
border-color: @warning;
|
|
color: @warning;
|
|
}
|
|
|
|
.has-error .input-group-addon {
|
|
background-color: lighten(@danger, 25%);
|
|
border-color: @danger;
|
|
color: @danger;
|
|
}
|
|
|
|
|
|
|
|
/* Input Size
|
|
--------------------*/
|
|
.input-sm {
|
|
// border-radius: 3px;
|
|
font-size: 12px;
|
|
height: 30px;
|
|
line-height: 1.5;
|
|
// padding: 5px 10px;
|
|
}
|
|
|
|
.input-lg {
|
|
// border-radius: 6px;
|
|
font-size: 18px;
|
|
height: 46px;
|
|
line-height: 1.33333;
|
|
// padding: 10px 16px;
|
|
}
|
|
|
|
|
|
/* Basic form
|
|
----------------------*/
|
|
|
|
label {
|
|
font-weight: 400;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
|
|
/* Form Horizontal
|
|
----------------------*/
|
|
|
|
.form-horizontal {
|
|
.control-label {
|
|
padding-top: 12px;
|
|
}
|
|
}
|
|
|
|
.form-horizontal {
|
|
.form-group {
|
|
margin-left: 0px;
|
|
margin-right: 0px;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|