| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192 |
- /**Variable**/
- @import './helpers/mixin.scss';
- @import './base/common.scss';
- @import './base/checked.scss';
- /*checkbox-group*/
- .vxe-checkbox-group {
- display: inline-block;
- vertical-align: middle;
- line-height: 1;
- }
- /*checkbox*/
- .vxe-checkbox {
- @extend %XECheckboxIcon;
- display: inline-block;
- vertical-align: middle;
- white-space: nowrap;
- line-height: 1;
- &+.vxe-checkbox {
- margin-left: 10px;
- }
- > input {
- &[type="checkbox"] {
- position: absolute;
- width: 0;
- height: 0;
- border: 0;
- appearance: none;
- }
- }
- &.is--indeterminate {
- > input {
- &:not(:checked) {
- &+.vxe-checkbox--icon {
- color: $vxe-primary-color;
- }
- }
- }
- }
- &:not(.is--disabled) {
- & > input {
- &:focus {
- &+.vxe-checkbox--icon {
- color: $vxe-primary-color;
- box-shadow: 0 0 0.2em 0 $vxe-primary-color;
- }
- }
- }
- &:hover {
- > input {
- &+.vxe-checkbox--icon {
- border-color: $vxe-primary-color;
- }
- }
- }
- }
- &.is--disabled {
- cursor: not-allowed;
- > input {
- &+.vxe-checkbox--icon {
- color: $vxe-input-disabled-color;
- &+.vxe-checkbox--label {
- color: $vxe-disabled-color;
- }
- }
- &:checked+.vxe-checkbox--icon {
- color: $vxe-input-disabled-color;
- }
- }
- }
- .vxe-checkbox--label {
- padding-left: 0.5em;
- vertical-align: middle;
- display: inline-block;
- max-width: 50em;
- @extend %TextEllipsis;
- }
- }
- .vxe-checkbox {
- font-size: $vxe-font-size;
- &.size--medium {
- font-size: $vxe-font-size-medium;
- }
- &.size--small {
- font-size: $vxe-font-size-small;
- }
- &.size--mini {
- font-size: $vxe-font-size-mini;
- }
- }
|