96 lines
2.0 KiB
SCSS
96 lines
2.0 KiB
SCSS
@mixin createAnimationTransition ($property, $duration: .1s, $func: ease-in-out) {
|
|
transition: $property $duration $func;
|
|
}
|
|
|
|
@mixin createCheckboxIcon {
|
|
.vxe-checkbox--icon {
|
|
font-size: 1.22em;
|
|
}
|
|
.vxe-checkbox--icon {
|
|
color: var(--vxe-ui-input-border-color);
|
|
vertical-align: middle;
|
|
font-weight: 700;
|
|
user-select: none;
|
|
}
|
|
&.is--checked,
|
|
&.is--indeterminate {
|
|
color: var(--vxe-ui-font-primary-color);
|
|
.vxe-checkbox--icon {
|
|
color: var(--vxe-ui-font-primary-color);
|
|
}
|
|
}
|
|
&:not(.is--disabled) {
|
|
cursor: pointer;
|
|
&:hover {
|
|
.vxe-checkbox--icon {
|
|
color: var(--vxe-ui-font-primary-color);
|
|
}
|
|
}
|
|
}
|
|
&.is--hidden {
|
|
cursor: default;
|
|
}
|
|
&.is--disabled {
|
|
color: var(--vxe-ui-font-disabled-color);
|
|
cursor: not-allowed;
|
|
.vxe-checkbox--icon {
|
|
color: var(--vxe-ui-input-disabled-color);
|
|
}
|
|
}
|
|
.vxe-checkbox--label {
|
|
padding-left: 0.5em;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
@mixin createRadioIcon {
|
|
cursor: pointer;
|
|
.vxe-radio--icon {
|
|
font-size: 1.26em;
|
|
}
|
|
.vxe-radio--icon {
|
|
color: var(--vxe-ui-input-border-color);
|
|
border-radius: 50%;
|
|
vertical-align: middle;
|
|
font-weight: 700;
|
|
user-select: none;
|
|
}
|
|
&.is--checked {
|
|
color: var(--vxe-ui-font-primary-color);
|
|
.vxe-radio--icon {
|
|
color: var(--vxe-ui-font-primary-color);
|
|
}
|
|
}
|
|
&:not(.is--disabled) {
|
|
cursor: pointer;
|
|
&:hover {
|
|
.vxe-radio--icon {
|
|
color: var(--vxe-ui-font-primary-color);
|
|
}
|
|
}
|
|
}
|
|
&.is--disabled {
|
|
color: var(--vxe-ui-font-disabled-color);
|
|
cursor: not-allowed;
|
|
.vxe-radio--icon {
|
|
color: var(--vxe-ui-input-disabled-color);
|
|
}
|
|
}
|
|
.vxe-radio--label {
|
|
padding-left: 0.5em;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
@mixin createEmptyMask {
|
|
&::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 1;
|
|
user-select: none;
|
|
}
|
|
} |