Wot Design Uni 版本号
1.3.13
平台
微信小程序
复现Demo地址(如不提供,将被直接关闭)
官网 https://wot-design-uni.cn/component/slider.html
重现步骤
官网滑块demo中,将滑块拖动到最高点,滑块 point 会挡住 min 和 max label。
期望的结果是什么?
min label 和 max label 距离 bar 有一段 margin,在 point 移动到顶点时不会遮挡文字
实际的结果是什么?
min label 和 max label 距离 bar 之间的 margin 没生效。
检查样式会发现如此样式,但是该样式没生效。
.wd-slider__label-max[data-v-0d14edbe] {
margin-left: var(--wot-slider-handle-radius, 12px) 11px;
}
环境信息
No response
其他补充信息
将 wd-slider/index.scss 中的第 79 和 82 行 修改应该就可以解决
@include e(label-min) {
--- margin-right: $-slider-handle-radius + 11px;
+++ margin-right: calc($-slider-handle-radius + 11px);
}
@include e(label-max) {
--- margin-left: $-slider-handle-radius + 11px;
+++ margin-left: calc($-slider-handle-radius + 11px);
}
Wot Design Uni 版本号
1.3.13
平台
微信小程序
复现Demo地址(如不提供,将被直接关闭)
官网 https://wot-design-uni.cn/component/slider.html
重现步骤
官网滑块demo中,将滑块拖动到最高点,滑块 point 会挡住 min 和 max label。
期望的结果是什么?
min label 和 max label 距离 bar 有一段 margin,在 point 移动到顶点时不会遮挡文字
实际的结果是什么?
min label 和 max label 距离 bar 之间的 margin 没生效。
检查样式会发现如此样式,但是该样式没生效。
环境信息
No response
其他补充信息
将 wd-slider/index.scss 中的第 79 和 82 行 修改应该就可以解决
@include e(label-min) { --- margin-right: $-slider-handle-radius + 11px; +++ margin-right: calc($-slider-handle-radius + 11px); } @include e(label-max) { --- margin-left: $-slider-handle-radius + 11px; +++ margin-left: calc($-slider-handle-radius + 11px); }