mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-05 19:41:45 +08:00
1a7889590f
* perf: remove CSS variables polyfill * style: fix missing calc value * perf: reduce some useless css vars
67 lines
1.5 KiB
Plaintext
67 lines
1.5 KiB
Plaintext
@import '../common/style/var.less';
|
|
|
|
.van-slider {
|
|
position: relative;
|
|
height: var(--slider-bar-height, @slider-bar-height);
|
|
border-radius: @border-radius-max;
|
|
background-color: var(
|
|
--slider-inactive-background-color,
|
|
@slider-inactive-background-color
|
|
);
|
|
|
|
// use pseudo element to expand click area
|
|
&::before {
|
|
position: absolute;
|
|
right: 0;
|
|
left: 0;
|
|
content: '';
|
|
top: calc(-1 * var(--padding-xs, @padding-xs));
|
|
bottom: calc(-1 * var(--padding-xs, @padding-xs));
|
|
}
|
|
|
|
&__bar {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: var(
|
|
--slider-active-background-color,
|
|
@slider-active-background-color
|
|
);
|
|
border-radius: inherit;
|
|
transition: all @animation-duration-fast;
|
|
}
|
|
|
|
&__button {
|
|
width: var(--slider-button-width, @slider-button-width);
|
|
height: var(--slider-button-height, @slider-button-height);
|
|
border-radius: var(
|
|
--slider-button-border-radius,
|
|
@slider-button-border-radius
|
|
);
|
|
box-shadow: var(--slider-button-box-shadow, @slider-button-box-shadow);
|
|
background-color: var(
|
|
--slider-button-background-color,
|
|
@slider-button-background-color
|
|
);
|
|
|
|
&-wrapper,
|
|
&-wrapper-right {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 0;
|
|
transform: translate3d(50%, -50%, 0);
|
|
}
|
|
|
|
&-wrapper-left {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 0;
|
|
transform: translate3d(-50%, -50%, 0);
|
|
}
|
|
}
|
|
|
|
&--disabled {
|
|
opacity: var(--slider-disabled-opacity, @slider-disabled-opacity);
|
|
}
|
|
}
|