bk-magic-vue/lib/ui/steps.min.css

基于蓝鲸 Magicbox 和 Vue 的前端组件库

@-webkit-keyframes loadingCircle{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes loadingCircle{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.bk-steps{display:table;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:0}.bk-steps .bk-icon{font-size:24px;line-height:24px}.bk-steps .bk-icon.icon-loading{display:inline-block;-webkit-animation:loadingCircle 1s linear infinite;animation:loadingCircle 1s linear infinite;font-size:14px}.bk-steps .bk-step.done .bk-step-icon,.bk-steps .bk-step.done .bk-step-number{border-color:#3a84ff;color:#3a84ff}.bk-steps .bk-step.done .bk-step-indicator:after,.bk-steps .bk-step.done .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#3a84ff),color-stop(0,transparent));background-image:linear-gradient(90deg,#3a84ff 50%,transparent 0)}.bk-steps .bk-step.done:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#3a84ff),color-stop(0,transparent));background-image:linear-gradient(#3a84ff 50%,transparent 0)}.bk-steps .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-indicator:after,.bk-steps .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps .bk-step.done:has(+.current.bk-step-error) .bk-step-indicator:after,.bk-steps .bk-step.done:has(+.current.bk-step-error) .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)]:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps .bk-step.done:has(+.current.bk-step-error):after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps .bk-step.current .bk-step-icon,.bk-steps .bk-step.current .bk-step-number,.bk-steps .bk-step.current .bk-step-text{background-color:#3a84ff;border-color:#3a84ff;color:#fff}.bk-steps .bk-step{-webkit-box-flex:1;-ms-flex:1;flex:1;position:relative;overflow:hidden;white-space:nowrap;margin-right:16px}.bk-steps .bk-step .bk-step-indicator{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:24px;height:24px;padding:0;margin-right:8px;border:1px solid #979ba5;border-radius:50%;line-height:24px;color:#979ba5;text-align:center;background-color:#fff;z-index:1;vertical-align:top}.bk-steps .bk-step .bk-step-number{font-size:14px;font-family:arial}.bk-steps .bk-step .bk-step-content{display:inline-block;vertical-align:top}.bk-steps .bk-step .bk-step-title{display:inline-block;position:relative;color:#63656e;font-size:14px;word-break:break-all;padding-right:16px;line-height:24px}.bk-steps .bk-step .bk-step-title:after{content:"";position:absolute;left:100%;top:12px;width:99999px;height:1px;background-color:transparent}.bk-steps .bk-step .bk-step-description{font-size:12px;color:#979ba5;white-space:normal;display:block;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bk-steps .bk-step.bk-step-no-content .bk-step-indicator{margin-right:0}.bk-steps .bk-step.bk-step-no-content .bk-step-indicator:after{content:"";position:absolute;left:100%;top:12px;width:99999px;height:1px;background-color:transparent}.bk-steps .bk-step.bk-step-no-content .bk-step-indicator:after{left:32px;top:10px}.bk-steps .bk-step:last-child{-webkit-box-flex:0;-ms-flex:none;flex:none;margin-right:0}.bk-steps .bk-step:last-child .bk-step-title{padding-right:0}.bk-steps .bk-step:last-child .bk-step-title:after{display:none}.bk-steps .bk-step.done .bk-step-title{color:#63656e}.bk-steps .bk-step.done .bk-step-description{color:#979ba5}.bk-steps .bk-step.current .bk-step-icon,.bk-steps .bk-step.current .bk-step-number,.bk-steps .bk-step.current .bk-step-text{border-width:2px}.bk-steps .bk-step.current .bk-step-description,.bk-steps .bk-step.current .bk-step-title{color:#63656e}.bk-steps .bk-step.current.bk-step-error .bk-step-indicator{background-color:#ff5656;border-color:#ff5656}.bk-steps .bk-step.current.bk-step-error .bk-step-description,.bk-steps .bk-step.current.bk-step-error .bk-step-title{color:#ff5656}.bk-steps-info .bk-step.done .bk-step-icon,.bk-steps-info .bk-step.done .bk-step-number{border-color:#88c3ff;color:#88c3ff}.bk-steps-info .bk-step.done .bk-step-indicator:after,.bk-steps-info .bk-step.done .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#88c3ff),color-stop(0,transparent));background-image:linear-gradient(90deg,#88c3ff 50%,transparent 0)}.bk-steps-info .bk-step.done:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#88c3ff),color-stop(0,transparent));background-image:linear-gradient(#88c3ff 50%,transparent 0)}.bk-steps-info .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-indicator:after,.bk-steps-info .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-info .bk-step.done:has(+.current.bk-step-error) .bk-step-indicator:after,.bk-steps-info .bk-step.done:has(+.current.bk-step-error) .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-info .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)]:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-info .bk-step.done:has(+.current.bk-step-error):after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-info .bk-step.current .bk-step-icon,.bk-steps-info .bk-step.current .bk-step-number,.bk-steps-info .bk-step.current .bk-step-text{background-color:#88c3ff;border-color:#88c3ff;color:#fff}.bk-steps-success .bk-step.done .bk-step-icon,.bk-steps-success .bk-step.done .bk-step-number{border-color:#2dcb56;color:#2dcb56}.bk-steps-success .bk-step.done .bk-step-indicator:after,.bk-steps-success .bk-step.done .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#2dcb56),color-stop(0,transparent));background-image:linear-gradient(90deg,#2dcb56 50%,transparent 0)}.bk-steps-success .bk-step.done:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#2dcb56),color-stop(0,transparent));background-image:linear-gradient(#2dcb56 50%,transparent 0)}.bk-steps-success .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-indicator:after,.bk-steps-success .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-success .bk-step.done:has(+.current.bk-step-error) .bk-step-indicator:after,.bk-steps-success .bk-step.done:has(+.current.bk-step-error) .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-success .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)]:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-success .bk-step.done:has(+.current.bk-step-error):after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-success .bk-step.current .bk-step-icon,.bk-steps-success .bk-step.current .bk-step-number,.bk-steps-success .bk-step.current .bk-step-text{background-color:#2dcb56;border-color:#2dcb56;color:#fff}.bk-steps-warning .bk-step.done .bk-step-icon,.bk-steps-warning .bk-step.done .bk-step-number{border-color:#ff9c01;color:#ff9c01}.bk-steps-warning .bk-step.done .bk-step-indicator:after,.bk-steps-warning .bk-step.done .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ff9c01),color-stop(0,transparent));background-image:linear-gradient(90deg,#ff9c01 50%,transparent 0)}.bk-steps-warning .bk-step.done:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ff9c01),color-stop(0,transparent));background-image:linear-gradient(#ff9c01 50%,transparent 0)}.bk-steps-warning .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-indicator:after,.bk-steps-warning .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-warning .bk-step.done:has(+.current.bk-step-error) .bk-step-indicator:after,.bk-steps-warning .bk-step.done:has(+.current.bk-step-error) .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-warning .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)]:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-warning .bk-step.done:has(+.current.bk-step-error):after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-warning .bk-step.current .bk-step-icon,.bk-steps-warning .bk-step.current .bk-step-number,.bk-steps-warning .bk-step.current .bk-step-text{background-color:#ff9c01;border-color:#ff9c01;color:#fff}.bk-steps-danger .bk-step.done .bk-step-icon,.bk-steps-danger .bk-step.done .bk-step-number{border-color:#ea3636;color:#ea3636}.bk-steps-danger .bk-step.done .bk-step-indicator:after,.bk-steps-danger .bk-step.done .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-danger .bk-step.done:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-danger .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-indicator:after,.bk-steps-danger .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)] .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-danger .bk-step.done:has(+.current.bk-step-error) .bk-step-indicator:after,.bk-steps-danger .bk-step.done:has(+.current.bk-step-error) .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(90deg,#ea3636 50%,transparent 0)}.bk-steps-danger .bk-step.done[\:has\(\%2B\%20.current.bk-step-error\)]:after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-danger .bk-step.done:has(+.current.bk-step-error):after{background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#ea3636),color-stop(0,transparent));background-image:linear-gradient(#ea3636 50%,transparent 0)}.bk-steps-danger .bk-step.current .bk-step-icon,.bk-steps-danger .bk-step.current .bk-step-number,.bk-steps-danger .bk-step.current .bk-step-text{background-color:#ea3636;border-color:#ea3636;color:#fff}.bk-steps-dashed .bk-step .bk-step-indicator:after,.bk-steps-dashed .bk-step .bk-step-title:after{background-image:-webkit-gradient(linear,left top,right top,color-stop(50%,#c4c6cc),color-stop(0,transparent));background-image:linear-gradient(90deg,#c4c6cc 50%,transparent 0);background-position:bottom;background-size:6px 1px;background-repeat:repeat-x}.bk-steps-solid .bk-step .bk-step-indicator:after,.bk-steps-solid .bk-step .bk-step-title:after{background-color:#c4c6cc}.bk-steps-vertical{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%}.bk-steps-vertical .bk-step{margin-bottom:16px;margin-right:0}.bk-steps-vertical .bk-step .bk-step-indicator:after,.bk-steps-vertical .bk-step .bk-step-title:after{display:none}.bk-steps-vertical .bk-step:after{content:"";position:absolute;left:12px;top:40px;height:100%;width:1px;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(50%,#c4c6cc),color-stop(0,transparent));background-image:linear-gradient(#c4c6cc 50%,transparent 0);background-position:100%;background-size:1px 6px;background-repeat:repeat-y}.bk-steps-vertical .bk-step .bk-step-title{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:left;margin-top:0}.bk-steps-small .bk-step .bk-step-indicator{width:20px;height:20px;line-height:20px}.bk-steps-small .bk-step .bk-step-title{font-size:12px;line-height:20px}.bk-steps-small .bk-step .bk-step-number{font-size:12px}.bk-steps-small .bk-step .bk-icon{font-size:12px;line-height:20px}.bk-steps-small .bk-step:after{left:10px;top:28px}.bk-steps-small .bk-step .bk-step-title:after{top:10px}.bk-steps-small .bk-step.bk-step-no-content .bk-step-indicator:after{left:28px;top:8px}
/*# sourceMappingURL=steps.min.css.map */