index.less 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. @import '../style/var';
  2. .van-radio {
  3. display: flex;
  4. align-items: center;
  5. overflow: hidden;
  6. cursor: pointer;
  7. user-select: none;
  8. &--disabled {
  9. cursor: not-allowed;
  10. }
  11. &--label-disabled {
  12. cursor: default;
  13. }
  14. &--horizontal {
  15. margin-right: @padding-sm;
  16. }
  17. &__icon {
  18. flex: none;
  19. height: 1em;
  20. font-size: @radio-size;
  21. line-height: 1em;
  22. cursor: pointer;
  23. .van-icon {
  24. display: block;
  25. box-sizing: border-box;
  26. width: 1.25em;
  27. height: 1.25em;
  28. color: transparent;
  29. font-size: 0.8em;
  30. line-height: 1.25;
  31. text-align: center;
  32. border: 1px solid @radio-border-color;
  33. transition-duration: @radio-transition-duration;
  34. transition-property: color, border-color, background-color;
  35. }
  36. &--round {
  37. .van-icon {
  38. border-radius: 100%;
  39. }
  40. }
  41. &--checked {
  42. .van-icon {
  43. color: @white;
  44. background-color: @radio-checked-icon-color;
  45. border-color: @radio-checked-icon-color;
  46. }
  47. }
  48. &--disabled {
  49. cursor: not-allowed;
  50. .van-icon {
  51. background-color: @radio-disabled-background-color;
  52. border-color: @radio-disabled-icon-color;
  53. }
  54. }
  55. &--disabled&--checked {
  56. .van-icon {
  57. color: @radio-disabled-icon-color;
  58. }
  59. }
  60. }
  61. &__label {
  62. margin-left: @radio-label-margin;
  63. color: @radio-label-color;
  64. line-height: @radio-size;
  65. &--left {
  66. margin: 0 @radio-label-margin 0 0;
  67. }
  68. &--disabled {
  69. color: @radio-disabled-label-color;
  70. }
  71. }
  72. }