109 lines
2.8 KiB
CSS
109 lines
2.8 KiB
CSS
|
:root {
|
||
|
--van-count-down-text-color: var(--van-text-color);
|
||
|
--van-count-down-font-size: var(--van-font-size-md);
|
||
|
--van-count-down-line-height: var(--van-line-height-md);
|
||
|
}
|
||
|
.van-count-down {
|
||
|
color: var(--van-count-down-text-color);
|
||
|
font-size: var(--van-count-down-font-size);
|
||
|
line-height: var(--van-count-down-line-height);
|
||
|
}
|
||
|
:root {
|
||
|
--van-slider-active-background: var(--van-primary-color);
|
||
|
--van-slider-inactive-background: var(--van-gray-3);
|
||
|
--van-slider-disabled-opacity: var(--van-disabled-opacity);
|
||
|
--van-slider-bar-height: 2px;
|
||
|
--van-slider-button-width: 24px;
|
||
|
--van-slider-button-height: 24px;
|
||
|
--van-slider-button-radius: 50%;
|
||
|
--van-slider-button-background: var(--van-white);
|
||
|
--van-slider-button-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
|
||
|
}
|
||
|
.van-theme-dark {
|
||
|
--van-slider-inactive-background: var(--van-background-3);
|
||
|
}
|
||
|
.van-slider {
|
||
|
position: relative;
|
||
|
width: 100%;
|
||
|
height: var(--van-slider-bar-height);
|
||
|
background: var(--van-slider-inactive-background);
|
||
|
border-radius: var(--van-radius-max);
|
||
|
cursor: pointer;
|
||
|
}
|
||
|
.van-slider:before {
|
||
|
position: absolute;
|
||
|
top: calc(var(--van-padding-xs) * -1);
|
||
|
right: 0;
|
||
|
bottom: calc(var(--van-padding-xs) * -1);
|
||
|
left: 0;
|
||
|
content: "";
|
||
|
}
|
||
|
.van-slider__bar {
|
||
|
position: absolute;
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
background: var(--van-slider-active-background);
|
||
|
border-radius: inherit;
|
||
|
transition: all var(--van-duration-fast);
|
||
|
}
|
||
|
.van-slider__button {
|
||
|
width: var(--van-slider-button-width);
|
||
|
height: var(--van-slider-button-height);
|
||
|
background: var(--van-slider-button-background);
|
||
|
border-radius: var(--van-slider-button-radius);
|
||
|
box-shadow: var(--van-slider-button-shadow);
|
||
|
}
|
||
|
.van-slider__button-wrapper {
|
||
|
position: absolute;
|
||
|
cursor: -webkit-grab;
|
||
|
cursor: grab;
|
||
|
top: 50%;
|
||
|
}
|
||
|
.van-slider__button-wrapper--right {
|
||
|
right: 0;
|
||
|
transform: translate3d(50%, -50%, 0);
|
||
|
}
|
||
|
.van-slider__button-wrapper--left {
|
||
|
left: 0;
|
||
|
transform: translate3d(-50%, -50%, 0);
|
||
|
}
|
||
|
.van-slider--disabled {
|
||
|
cursor: not-allowed;
|
||
|
opacity: var(--van-slider-disabled-opacity);
|
||
|
}
|
||
|
.van-slider--disabled .van-slider__button-wrapper {
|
||
|
cursor: not-allowed;
|
||
|
}
|
||
|
.van-slider--vertical {
|
||
|
display: inline-block;
|
||
|
width: var(--van-slider-bar-height);
|
||
|
height: 100%;
|
||
|
}
|
||
|
.van-slider--vertical .van-slider__button-wrapper--right {
|
||
|
top: auto;
|
||
|
right: 50%;
|
||
|
bottom: 0;
|
||
|
transform: translate3d(50%, 50%, 0);
|
||
|
}
|
||
|
.van-slider--vertical .van-slider__button-wrapper--left {
|
||
|
top: 0;
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translate3d(50%, -50%, 0);
|
||
|
}
|
||
|
.van-slider--vertical:before {
|
||
|
top: 0;
|
||
|
right: calc(var(--van-padding-xs) * -1);
|
||
|
bottom: 0;
|
||
|
left: calc(var(--van-padding-xs) * -1);
|
||
|
}
|
||
|
.vipbg[data-v-f578f73d] {
|
||
|
background-image: url(/png/name-5d0d62fa.png);
|
||
|
background-repeat: no-repeat;
|
||
|
background-size: 100% 100%;
|
||
|
}
|
||
|
.titles[data-v-f578f73d] {
|
||
|
background: #999;
|
||
|
color: #fff;
|
||
|
}
|