index.less 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. @import '../style/var';
  2. .van-picker {
  3. overflow: hidden;
  4. user-select: none;
  5. position: relative;
  6. background-color: @white;
  7. -webkit-text-size-adjust: 100%; /* avoid iOS text size adjust */
  8. &__toolbar {
  9. display: flex;
  10. height: 44px;
  11. line-height: 44px;
  12. justify-content: space-between;
  13. }
  14. &__cancel,
  15. &__confirm {
  16. color: @blue;
  17. padding: 0 15px;
  18. font-size: 14px;
  19. &:active {
  20. background-color: @active-color;
  21. }
  22. }
  23. &__title {
  24. max-width: 50%;
  25. font-size: 16px;
  26. font-weight: 500;
  27. text-align: center;
  28. }
  29. &__columns {
  30. display: flex;
  31. position: relative;
  32. }
  33. &__loading {
  34. top: 0;
  35. left: 0;
  36. right: 0;
  37. bottom: 0;
  38. z-index: 2;
  39. position: absolute;
  40. background-color: rgba(255, 255, 255, .9);
  41. circle {
  42. stroke: @blue;
  43. }
  44. }
  45. &__loading .van-loading,
  46. &__frame {
  47. top: 50%;
  48. left: 0;
  49. width: 100%;
  50. z-index: 1;
  51. position: absolute;
  52. pointer-events: none;
  53. transform: translateY(-50%);
  54. }
  55. &-column {
  56. flex: 1;
  57. overflow: hidden;
  58. font-size: 16px;
  59. text-align: center;
  60. &__item {
  61. padding: 0 5px;
  62. color: @gray-dark;
  63. &--selected {
  64. font-weight: 500;
  65. color: @text-color;
  66. }
  67. &--disabled {
  68. opacity: .3;
  69. }
  70. }
  71. }
  72. }