| //// |
| /// @group components/checkbox |
| //// |
| |
| /// Global checkbox style. |
| @mixin os-checkbox { |
| line-height: $v-unit-size; |
| |
| label { |
| padding-left: ceil($v-unit-size / 2); |
| } |
| |
| > input ~ label:before, > input~ label:after { |
| width: $v-unit-size; |
| height: $v-unit-size - first-number($v-border); |
| position: absolute; |
| left: 0px !important; |
| font-size: $v-font-size; |
| line-height: $v-unit-size; |
| } |
| > input ~ label:before { |
| height: $v-unit-size; |
| border: 0px; |
| border-bottom: $v-border !important; |
| background: $os-textfield-shade; |
| @include box-shadow(none); //valo mixin |
| } |
| > input:focus ~ label:before { |
| background-color: $os-focus-color; |
| border-bottom-color: $v-focus-color; |
| } |
| } |