tzcloud-best-ui
Version:
A super practical component library that developed by vue2.x and element-ui
1 lines • 3.57 kB
CSS
.best-dialog .el-dialog:not(.is-fullscreen) .el-dialog__body{max-height:600px;padding:20px;overflow:auto}.best-dialog .el-cascader,.best-dialog .el-date-editor,.best-dialog .el-select{width:100%}.best-drawer .el-drawer__header{padding:10px 20px;margin-bottom:10px}.best-puzzler{position:relative;width:100%}.best-puzzler__inner{position:relative;margin-bottom:10px;min-height:200px;background:#ccc}.best-puzzler__img1{width:100%;height:auto}.best-puzzler__img2{position:absolute;top:0;left:0;height:auto;z-index:1}.best-puzzler__tips{position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.7);z-index:2}.best-puzzler__tips-wrap{position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);color:#fff;font-size:14px;text-align:center;line-height:normal}.best-puzzler__tips-icon{font-size:24px}.best-puzzler__slider{background:#f4f5f6;border-radius:3px;color:#909399;padding-right:64px;position:relative}.best-puzzler__slider-text{position:absolute;top:0;right:0;bottom:0;left:0;color:#909399;font-size:14px;line-height:44px;padding-left:64px;text-align:center}.best-puzzler__slider .el-slider__runway{background:transparent;border-radius:0;height:44px;margin:0}.best-puzzler__slider.is-success .el-slider__bar{background:#e1f3d8}.best-puzzler__slider.is-fail .el-slider__bar{background:#fde2e2}.best-puzzler__slider .el-slider__bar{height:44px}.best-puzzler__slider .el-slider__button-wrapper{position:absolute;top:2px;left:0;width:auto;height:auto;transform:none}.best-puzzler__slider .el-slider__button{background-color:#fff;border:none;border-radius:3px;box-sizing:border-box;box-shadow:0 0 2px 0 rgba(0,0,0,.2);width:64px;height:40px;cursor:pointer}.best-puzzler__slider .el-slider__button.dragging,.best-puzzler__slider .el-slider__button.hover,.best-puzzler__slider .el-slider__button:hover{transform:none}.best-puzzler__slider .el-slider__button:after{content:">>";position:absolute;left:0;top:50%;width:100%;height:20px;line-height:20px;margin-top:-10px;text-align:center;font-size:16px;font-weight:700;color:inherit}.best-puzzler .fade-enter-active,.best-puzzler .fade-leave-active{transition:all .28s ease-in-out}.best-puzzler .fade-enter,.best-puzzler .fade-leave-to{opacity:0}.best-dialog-puzzler__title{color:#303133;font-size:16px;line-height:22px;margin-bottom:10px}.best-uploader{display:inline-block;vertical-align:top;position:relative}.best-uploader+.best-uploader{margin-left:20px}.best-uploader__inner{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;width:150px;height:150px;border:1px dashed #c0ccda;text-align:center;background-color:#fbfdff;border-radius:6px;box-sizing:border-box;cursor:pointer;overflow:hidden;position:relative}.best-uploader__inner:hover{border-color:#409eff}.best-uploader__inner .best-uploader__icon{font-size:28px;color:#8c939d}.best-uploader__inner .best-uploader__text{display:inline-block;width:100%;padding:0 10px;margin-top:10px;font-size:14px;color:#909399;line-height:normal}.best-uploader__modal{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3}.best-uploader__mask,.best-uploader__modal,.best-uploader__modal>img{width:100%;height:100%}.best-uploader__mask{position:absolute;top:0;left:0;cursor:default;text-align:center;color:#fff;opacity:0;font-size:20px;background-color:rgba(0,0,0,.5);transition:opacity .3s}.best-uploader__mask:hover{opacity:1}.best-uploader__action-remove{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:pointer}