123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115 |
- @import "../common/index.acss";
- .van-picker {
- position: relative;
- overflow: hidden;
- -webkit-text-size-adjust: 100%;
- -webkit-user-select: none;
- user-select: none;
- background-color: #fff;
- background-color: var(--picker-background-color, #fff);
- }
- .van-picker__toolbar {
- display: -webkit-flex;
- display: flex;
- -webkit-justify-content: space-between;
- justify-content: space-between;
- height: 44px;
- height: var(--picker-toolbar-height, 44px);
- line-height: 44px;
- line-height: var(--picker-toolbar-height, 44px);
- }
- .van-picker__cancel,
- .van-picker__confirm {
- padding: 0 16px;
- padding: var(--picker-action-padding, 0 16px);
- font-size: 14px;
- font-size: var(--picker-action-font-size, 14px);
- }
- .van-picker__cancel--hover,
- .van-picker__confirm--hover {
- opacity: 0.7;
- }
- .van-picker__confirm {
- color: #576b95;
- color: var(--picker-confirm-action-color, #576b95);
- }
- .van-picker__cancel {
- color: #969799;
- color: var(--picker-cancel-action-color, #969799);
- }
- .van-picker__title {
- max-width: 50%;
- text-align: center;
- font-weight: 500;
- font-weight: var(--font-weight-bold, 500);
- font-size: 16px;
- font-size: var(--picker-option-font-size, 16px);
- }
- .van-picker__columns {
- position: relative;
- display: -webkit-flex;
- display: flex;
- }
- .van-picker__column {
- -webkit-flex: 1 1;
- flex: 1 1;
- width: 0;
- }
- .van-picker__loading {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- z-index: 4;
- display: -webkit-flex;
- display: flex;
- -webkit-align-items: center;
- align-items: center;
- -webkit-justify-content: center;
- justify-content: center;
- background-color: hsla(0, 0%, 100%, 0.9);
- background-color: var(--picker-loading-mask-color, hsla(0, 0%, 100%, 0.9));
- }
- .van-picker__mask {
- top: 0;
- left: 0;
- z-index: 2;
- width: 100%;
- height: 100%;
- background-image: linear-gradient(
- 180deg,
- hsla(0, 0%, 100%, 0.9),
- hsla(0, 0%, 100%, 0.4)
- ),
- linear-gradient(0deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4));
- background-repeat: no-repeat;
- background-position: top, bottom;
- -webkit-backface-visibility: hidden;
- backface-visibility: hidden;
- }
- .van-picker__frame,
- .van-picker__mask {
- position: absolute;
- pointer-events: none;
- }
- .van-picker__frame {
- top: 50%;
- right: 16px;
- left: 16px;
- z-index: 1;
- -webkit-transform: translateY(-50%);
- transform: translateY(-50%);
- }
|