index.acss 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. .slider-index {
  2. display: block;
  3. height: initial;
  4. }
  5. @import "../common/index.acss";
  6. .slider-index .van-slider {
  7. position: relative;
  8. border-radius: 999px;
  9. border-radius: var(--border-radius-max, 999px);
  10. background-color: #ebedf0;
  11. background-color: var(--slider-inactive-background-color, #ebedf0);
  12. }
  13. .slider-index .van-slider:before {
  14. position: absolute;
  15. right: 0;
  16. left: 0;
  17. content: "";
  18. top: -8px;
  19. top: -var(--padding-xs, 8px);
  20. bottom: -8px;
  21. bottom: -var(--padding-xs, 8px);
  22. }
  23. .slider-index .van-slider__bar {
  24. position: relative;
  25. border-radius: inherit;
  26. transition: width 0.2s;
  27. transition: width var(--animation-duration-fast, 0.2s);
  28. background-color: #1989fa;
  29. background-color: var(--slider-active-background-color, #1989fa);
  30. }
  31. .slider-index .van-slider__button {
  32. width: 24px;
  33. height: 24px;
  34. border-radius: 50%;
  35. box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  36. background-color: #fff;
  37. background-color: var(--slider-button-background-color, #fff);
  38. }
  39. .slider-index .van-slider__button-wrapper {
  40. position: absolute;
  41. top: 50%;
  42. right: 0;
  43. -webkit-transform: translate3d(50%, -50%, 0);
  44. transform: translate3d(50%, -50%, 0);
  45. }
  46. .slider-index .van-slider--disabled {
  47. opacity: 0.5;
  48. }