humhub/less/form.less

276 lines
4.8 KiB
Plaintext

//
// Forms
// --------------------------------------------------
.radio,
.checkbox {
margin-top: 5px !important;
margin-bottom: 0;
}
.radio label,
.checkbox label {
padding-left: 10px;
}
.form-control {
border: 2px solid @background2;
box-shadow: none;
&:focus {
border: 2px solid @info;
outline: 0;
box-shadow: none;
}
}
.form-control.form-search {
border-radius: 30px;
background-image: url("../img/icon_search16x16.png");
background-repeat: no-repeat;
background-position: 10px 8px;
padding-left: 34px;
}
.form-group-search {
position: relative;
.form-button-search {
position: absolute;
top: 4px;
right: 4px;
border-radius: 30px;
}
}
textarea {
resize: none;
height: 1.5em;
}
select.form-control {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-image: url("../img/select_arrow.png") !important;
background-repeat: no-repeat;
background-position: right 13px;
overflow: hidden;
}
label {
font-weight: normal;
}
label.control-label {
font-weight: bold;
}
// Placeholder text
::-webkit-input-placeholder {
color: @font4 !important;
}
::-moz-placeholder {
color: @font4 !important;
}
/* firefox 19+ */
:-ms-input-placeholder {
color: @font4 !important;
}
/* ie */
input:-moz-placeholder {
color: @font4 !important;
}
// Placeholder text for empty content
.placeholder {
padding: 10px;
}
// HTML5 Placeholder jQuery Plugin
input.placeholder,
textarea.placeholder {
padding: 0 0 0 10px;
color: #999;
}
.help-block-error {
font-size: 12px;
}
.help-block:not(.help-block-error) {
color: @font5 !important;
font-size: 12px;
}
.help-block:not(.help-block-error):hover {
color: @font2 !important;
font-size: 12px;
}
.input-group-addon {
border: none;
}
//
// Labels
// --------------------------------------------------
.label {
text-transform: uppercase;
}
.label {
text-transform: uppercase;
display: inline-block;
padding: 3px 5px 4px;
font-weight: 600;
font-size: 10px !important;
color: white !important;
vertical-align: baseline;
white-space: nowrap;
text-shadow: none;
}
.label-default {
background: @background2;
color: @font2 !important;
}
a.label-default:hover {
background: darken(@background2, 5%) !important;
}
.label-info {
background-color: @info;
}
a.label-info:hover {
background: darken(@info, 5%) !important;
}
.label-danger {
background-color: @danger;
}
a.label-danger:hover {
background: darken(@danger, 5%) !important;
}
.label-success {
background-color: @info;
}
a.label-success:hover {
background: darken(@info, 5%) !important;
}
.label-warning {
background-color: @warning;
}
a.label-warning:hover {
background: darken(@warning, 5%) !important;
}
// Flatelements
.onoffswitch-inner:before {
background-color: @info;
color: #fff;
}
.onoffswitch-inner:after {
background-color: @background3;
color: #999;
text-align: right;
}
.regular-checkbox:checked + .regular-checkbox-box {
border: 2px solid @info;
background: @info;
color: white;
}
.regular-checkbox-box.disabled {
background: @background3 !important;
border: 2px solid @background3 !important;
cursor: not-allowed;
}
.regular-radio:checked + .regular-radio-button:after {
background: @info;
}
.regular-radio:checked + .regular-radio-button {
background-color: none;
color: #99a1a7;
border: 2px solid @background3;
margin-right: 5px;
}
.regular-radio.disabled {
background: @background3 !important;
border: 2px solid @background3 !important;
cursor: not-allowed;
}
//
// Errror handling
//
.errorMessage {
color: @danger;
padding: 10px 0;
}
// Errror handling
.error {
border-color: @danger !important;
}
.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline {
color: @danger !important;
}
.has-error .form-control,
.has-error .form-control:focus {
border-color: @danger;
-webkit-box-shadow: none;
box-shadow: none;
}
.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline {
color: @success;
}
.has-success .form-control,
.has-success .form-control:focus {
border-color: @success;
-webkit-box-shadow: none;
box-shadow: none;
}
.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline {
color: @warning;
}
.has-warning .form-control,
.has-warning .form-control:focus {
border-color: @warning;
-webkit-box-shadow: none;
box-shadow: none;
}