UNPKG

@beeapi/nutui

Version:

一套轻量级移动端Vue组件库

5 lines 2.93 kB
/*! * @beeapi/nutui v2.2.10 - range.css, 451ed2404bee284b891e, Sat Dec 19 2020 12:06:10 GMT+0800 (中国标准时间) * (c) 2017-2020 JDC * Released under the MIT License. */.nut-range{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:30px;margin:0 10px}.nut-range .nut-range-box{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;position:relative;height:3px;-webkit-border-radius:5px;border-radius:5px;background:rgba(240,37,15,.3)}.nut-range .nut-range-area{position:absolute;top:0;height:3px;z-index:123;background:#f0250f}.nut-range .nut-range-label{pointer-events:none;opacity:0;position:absolute;top:50%;left:50%;background:#f0250f;-webkit-transition:opacity,-webkit-transform .2s linear;transition:opacity,-webkit-transform .2s linear;-o-transition:opacity,transform .2s linear;transition:opacity,transform .2s linear;transition:opacity,transform .2s linear,-webkit-transform .2s linear;-webkit-transform:translate(-50%,-100%);-ms-transform:translate(-50%,-100%);transform:translate(-50%,-100%);font-size:12px;padding:5px;color:#fff;-webkit-border-radius:4px;border-radius:4px;z-index:9999}.nut-range .nut-range-label.nut-range-label-always{opacity:1;-webkit-transform:translate(-50%,-160%);-ms-transform:translate(-50%,-160%);transform:translate(-50%,-160%)}.nut-range .nut-range-label .nut-range-after{position:absolute;top:100%;left:50%;-webkit-transform:translate(-50%,-6px);-ms-transform:translate(-50%,-6px);transform:translate(-50%,-6px);height:12px;width:12px;font-family:Arial,Helvetica,sans-serif;font-size:12px;text-align:center;color:#f0250f}.nut-range .nut-range-left-text{margin-right:15px}.nut-range .nut-range-right-text{margin-left:15px}.nut-range .nut-range-Handle{position:absolute;top:50%;left:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);height:20px;width:20px;-webkit-border-radius:50%;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-shadow:none;box-shadow:none;border:2px solid #f0250f;-webkit-transition:border-width .5s ease-in,-webkit-box-shadow;transition:border-width .5s ease-in,-webkit-box-shadow;-o-transition:box-shadow,border-width .5s ease-in;transition:box-shadow,border-width .5s ease-in;transition:box-shadow,border-width .5s ease-in,-webkit-box-shadow;background-color:#fff;z-index:124}.nut-range .nut-range-Handle.nut-range-ani{border-width:8px!important;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.nut-range .nut-range-Handle.nut-range-ani .nut-range-label{opacity:1;background:#f0250f;-webkit-transform:translate(-50%,-160%);-ms-transform:translate(-50%,-160%);transform:translate(-50%,-160%)}