checked.scss 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. %XECheckboxIcon {
  2. .vxe-checkbox--icon {
  3. font-size: 1.34em;
  4. }
  5. .vxe-checkbox--icon {
  6. color: $vxe-input-border-color;
  7. vertical-align: middle;
  8. font-weight: 700;
  9. user-select: none;
  10. }
  11. &.is--checked,
  12. &.is--indeterminate {
  13. color: $vxe-primary-color;
  14. .vxe-checkbox--icon {
  15. color: $vxe-primary-color;
  16. }
  17. }
  18. &:not(.is--disabled) {
  19. cursor: pointer;
  20. &:hover {
  21. .vxe-checkbox--icon {
  22. color: $vxe-primary-color;
  23. }
  24. }
  25. }
  26. &.is--disabled {
  27. color: $vxe-disabled-color;
  28. cursor: not-allowed;
  29. .vxe-checkbox--icon {
  30. color: $vxe-input-disabled-color;
  31. }
  32. }
  33. .vxe-checkbox--label {
  34. padding-left: 0.5em;
  35. vertical-align: middle;
  36. }
  37. }
  38. %XERadioIcon {
  39. cursor: pointer;
  40. .vxe-radio--icon {
  41. font-size: 1.4em;
  42. }
  43. .vxe-radio--icon {
  44. color: $vxe-input-border-color;
  45. vertical-align: middle;
  46. font-weight: 700;
  47. user-select: none;
  48. }
  49. &.is--checked {
  50. color: $vxe-primary-color;
  51. .vxe-radio--icon {
  52. color: $vxe-primary-color;
  53. }
  54. }
  55. &:not(.is--disabled) {
  56. cursor: pointer;
  57. &:hover {
  58. .vxe-radio--icon {
  59. color: $vxe-primary-color;
  60. }
  61. }
  62. }
  63. &.is--disabled {
  64. color: $vxe-disabled-color;
  65. cursor: not-allowed;
  66. .vxe-radio--icon {
  67. color: $vxe-input-disabled-color;
  68. }
  69. }
  70. .vxe-radio--label {
  71. padding-left: 0.5em;
  72. vertical-align: middle;
  73. }
  74. }