index.wxss 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. @import '../common/index.wxss';
  2. .van-picker {
  3. position: relative;
  4. overflow: hidden;
  5. -webkit-text-size-adjust: 100%;
  6. -webkit-user-select: none;
  7. user-select: none;
  8. background-color: #fff;
  9. background-color: var(--picker-background-color, #fff)
  10. }
  11. .van-picker__toolbar {
  12. display: -webkit-flex;
  13. display: flex;
  14. -webkit-justify-content: space-between;
  15. justify-content: space-between;
  16. height: 44px;
  17. height: var(--picker-toolbar-height, 44px);
  18. line-height: 44px;
  19. line-height: var(--picker-toolbar-height, 44px)
  20. }
  21. .van-picker__cancel,
  22. .van-picker__confirm {
  23. padding: 0 16px;
  24. padding: var(--picker-action-padding, 0 16px);
  25. font-size: 14px;
  26. font-size: var(--picker-action-font-size, 14px)
  27. }
  28. .van-picker__cancel--hover,
  29. .van-picker__confirm--hover {
  30. opacity: .7
  31. }
  32. .van-picker__confirm {
  33. color: #576b95;
  34. color: var(--picker-confirm-action-color, #576b95)
  35. }
  36. .van-picker__cancel {
  37. color: #969799;
  38. color: var(--picker-cancel-action-color, #969799)
  39. }
  40. .van-picker__title {
  41. max-width: 50%;
  42. text-align: center;
  43. font-weight: 500;
  44. font-weight: var(--font-weight-bold, 500);
  45. font-size: 16px;
  46. font-size: var(--picker-option-font-size, 16px)
  47. }
  48. .van-picker__columns {
  49. position: relative;
  50. display: -webkit-flex;
  51. display: flex
  52. }
  53. .van-picker__column {
  54. -webkit-flex: 1 1;
  55. flex: 1 1;
  56. width: 0
  57. }
  58. .van-picker__loading {
  59. position: absolute;
  60. top: 0;
  61. right: 0;
  62. bottom: 0;
  63. left: 0;
  64. z-index: 4;
  65. display: -webkit-flex;
  66. display: flex;
  67. -webkit-align-items: center;
  68. align-items: center;
  69. -webkit-justify-content: center;
  70. justify-content: center;
  71. background-color: hsla(0, 0%, 100%, .9);
  72. background-color: var(--picker-loading-mask-color, hsla(0, 0%, 100%, .9))
  73. }
  74. .van-picker__mask {
  75. top: 0;
  76. left: 0;
  77. z-index: 2;
  78. width: 100%;
  79. height: 100%;
  80. background-image: linear-gradient(180deg, hsla(0, 0%, 100%, .9), hsla(0, 0%, 100%, .4)), linear-gradient(0deg, hsla(0, 0%, 100%, .9), hsla(0, 0%, 100%, .4));
  81. background-repeat: no-repeat;
  82. background-position: top, bottom;
  83. -webkit-backface-visibility: hidden;
  84. backface-visibility: hidden
  85. }
  86. .van-picker__frame,
  87. .van-picker__mask {
  88. position: absolute;
  89. pointer-events: none
  90. }
  91. .van-picker__frame {
  92. top: 50%;
  93. right: 16px;
  94. left: 16px;
  95. z-index: 1;
  96. -webkit-transform: translateY(-50%);
  97. transform: translateY(-50%)
  98. }