jiku-ui
Version:
A Component Library for Vue.js.
1 lines • 3.53 kB
CSS
.hn-step-node{position:relative;display:inline-block;-ms-flex-negative:1;flex-shrink:1}.hn-step-node:last-of-type .hn-step-node__line{display:none}.hn-step-node:last-of-type.is-flex{-ms-flex-preferred-size:auto;flex-basis:auto;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.hn-step-node:last-of-type .hn-step-node__description,.hn-step-node:last-of-type .hn-step-node__main{padding-right:0}.hn-step-node__header{margin-bottom:12px}.hn-step-node__header__title{font-size:14px;font-weight:700;color:#000}.hn-step-node__header__title.is-wait{color:#C0C4CC}.hn-step-node__header__title.is-error{color:#F56C6C}.hn-step-node__header__description{font-size:12px;color:#303133}.hn-step-node__header__description.is-wait{color:#C0C4CC}.hn-step-node__header__description.is-error{color:#F56C6C}.hn-step-node__head{position:relative;width:100%}.hn-step-node__head.is-process{color:#303133;border-color:#303133}.hn-step-node__head.is-process .hn-step-node__icon{color:#fff;border-color:#409EFF;background:#409EFF}.hn-step-node__head.is-error .hn-step-node__line,.hn-step-node__head.is-process .hn-step-node__line,.hn-step-node__head.is-wait .hn-step-node__line{background-color:#C0C4CC}.hn-step-node__head.is-wait{color:#C0C4CC;border-color:#C0C4CC}.hn-step-node__head.is-error{color:#F56C6C;border-color:#F56C6C}.hn-step-node__head.is-finish{color:#409EFF;border-color:#409EFF}.hn-step-node__icon{position:relative;z-index:1;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:38px;height:38px;font-size:14px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#FFF;-webkit-transition:.15s ease-out;transition:.15s ease-out}.hn-step-node__icon.is-text{border-radius:50%;border:2px solid;border-color:inherit}.hn-step-node__icon.is-icon{width:40px}.hn-step-node__icon-inner{display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:center;font-weight:700;line-height:1;color:inherit}.hn-step-node__icon-inner[class*=hn-icon]:not(.is-status){font-size:25px;font-weight:400}.hn-step-node__icon-inner.is-status{-webkit-transform:translateY(1px);transform:translateY(1px)}.hn-step-node__line{position:absolute;height:2px;top:18px;left:0;right:0;border-color:inherit;background-color:#409EFF}.hn-step-node__line-inner{display:block;border-width:0;border-style:solid;border-color:inherit;-webkit-transition:.15s ease-out;transition:.15s ease-out;-webkit-box-sizing:border-box;box-sizing:border-box;width:0;height:0}.hn-step-node__main{white-space:normal;text-align:left;margin-top:20px}.hn-step-node__title{margin-bottom:3px;font-size:14px;font-weight:700;color:#000}.hn-step-node__title.is-process{color:#303133}.hn-step-node__title.is-wait{color:#C0C4CC}.hn-step-node__title.is-error{color:#F56C6C}.hn-step-node__description{padding-right:10%;margin-top:-5px;font-size:14px;font-weight:400;color:#000}.hn-step-node__description.is-process{color:#303133}.hn-step-node__description.is-wait{color:#C0C4CC}.hn-step-node__description.is-error{color:#F56C6C}.hn-step-node.is-center .hn-step-node__head,.hn-step-node.is-center .hn-step-node__header,.hn-step-node.is-center .hn-step-node__main{text-align:center}.hn-step-node.is-center .hn-step-node__description{padding-left:20%;padding-right:20%}.hn-step-node.is-center .hn-step-node__line{left:50%;right:-50%}