blob: 074ba142ce8a69f81bb8d779bea3f93db5a12bbe [file] [log] [blame]
label, legend {
font-size:1em;
font-weight: 300;
margin: 0;
&.disabled {
color: $lightbg__grey;
}
.error {
font-size: .9em;
}
}
input[type='email'],
input[type='number'],
input[type='password'],
input[type='search'],
input[type='tel'],
input[type='url'],
input[type='text'],
textarea {
border-radius: 0px;
border: 1px solid $lightgrey;
height: 3.1em;
margin: 0 0 1em 0;
background: $white;
box-shadow: 0 0 0;
transition: none !important;
&:focus {
border-color: $lightbg__accent;
border-bottom: 5px solid $lightbg__primary;
}
&:disabled, .disabled {
background: $field__disabled;
border: 1px solid $lightbg__grey;
}
&.input__error {
border-color: $error-color;
}
}
textarea { padding: .2em;
height: auto;}
input[type="submit"] {
margin: 1em 0;
width: 100%;
}
//Custom select
select{
border-radius: 0px;
height:auto;
@include fastTransition-all;
@include bgImage__arrowDown-primary;
&:focus {
border-color: $lightbg__accent;
@include bgImage__arrowDown-accent;
box-shadow: 0 0 0;
}
}
//Custom Checkbox and Radio
.checkbox-custom,
.radio-custom {
opacity: 0;
position: absolute;
}
.checkbox-custom, .checkbox-custom-label,
.radio-custom,
.radio-custom-label {
display: inline-block;
vertical-align: middle;
margin: .1em 0 .1em -.5em;
padding: .5em;
cursor: pointer;
}
.checkbox-custom-label, .radio-custom-label {
position: relative;
padding-left: 2em;
}
.checkbox-custom + .checkbox-custom-label:before,
.radio-custom + .radio-custom-label:before {
content: '';
background: #fff;
border: 1px solid $lightbg__grey;
display: inline-block;
vertical-align: middle;
width: 16px;
height: 16px;
margin-right: 10px;
margin-top: -3px;
text-align: center;
position: absolute;
left: 9px;
top: 15px;
}
.checkbox-custom:checked + .checkbox-custom-label:after {
content: '\2713';
position: absolute;
left: 10px;
top: 3px;
font-size: 1em;
padding: 4px 0 0 2px;
color: $white;
}
.checkbox-custom:checked + .checkbox-custom-label:before {
background: $lightbg__primary;
@include fastTransition-all;
}
.radio-custom + .radio-custom-label:before {
border-radius: 50%;
}
.radio-custom:checked + .radio-custom-label:before {
background: $lightbg__primary;
@include fastTransition-all;
box-shadow: inset 0px 0px 0px 2px #fff;
}
.checkbox-custom:focus + .checkbox-custom-label, .radio-custom:focus + .radio-custom-label {
outline: 1px solid $lightbg__grey; /* focus style */
}