@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; } }