mand-mobile/lib/steps/style/index.css

A Vue.js 2.0 Mobile UI Toolkit

.md-steps{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-justify-content:space-around;justify-content:space-around;font-size:28px}.md-steps.md-steps-horizontal{-webkit-box-align:center;-webkit-align-items:center;align-items:center;padding:40px 100px 100px}.md-steps.md-steps-horizontal .step-wrapper{margin:0 4px;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column}.md-steps.md-steps-horizontal .step-wrapper.reached .text-wrapper .name{color:#41485d}.md-steps.md-steps-horizontal .step-wrapper.current .text-wrapper .name{color:#198cff}.md-steps.md-steps-horizontal .text-wrapper{top:100%;padding-top:20px;text-align:center}.md-steps.md-steps-horizontal .text-wrapper .name{color:#858b9c}.md-steps.md-steps-horizontal .text-wrapper .desc{margin-top:10px;color:#858b9c}.md-steps.md-steps-horizontal.no-current .reached:last-of-type{display:none!important}.md-steps.md-steps-vertical{-webkit-box-align:start;-webkit-align-items:flex-start;align-items:flex-start;padding:40px;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column}.md-steps.md-steps-vertical.vertical-adaptive{-webkit-box-pack:normal;-webkit-justify-content:normal;justify-content:normal;padding:40px 40px 8px}.md-steps.md-steps-vertical.vertical-adaptive .bar.vertical-bar{-webkit-box-flex:1;-webkit-flex:1;flex:1}.md-steps.md-steps-vertical .step-wrapper{width:100%;margin:4px 0;-webkit-box-align:stretch;-webkit-align-items:stretch;align-items:stretch}.md-steps.md-steps-vertical .step-wrapper .icon-wrapper{position:relative}.md-steps.md-steps-vertical .step-wrapper .icon-wrapper .step-node-default{min-width:32px;min-height:32px}.md-steps.md-steps-vertical .step-wrapper .text-wrapper{left:32px;padding-left:40px}.md-steps.md-steps-vertical .step-wrapper .text-wrapper .desc,.md-steps.md-steps-vertical .step-wrapper .text-wrapper .name{white-space:normal}.md-steps.md-steps-vertical .step-wrapper .text-wrapper .name{color:#41485d}.md-steps.md-steps-vertical .step-wrapper .text-wrapper .desc{margin-top:18px;color:#858b9c}.md-steps .icon-wrapper{color:#e2e4ea}.md-steps .icon-wrapper,.md-steps .icon-wrapper>div{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.md-steps .icon-wrapper:nth-child(2){display:none}.md-steps .icon-wrapper .step-node-default-icon{background:#e2e4ea}.md-steps .step-wrapper{display:-webkit-box;display:-webkit-flex;display:flex;position:relative}.md-steps .step-wrapper,.md-steps .step-wrapper .icon-wrapper{min-width:32px;min-height:32px}.md-steps .step-wrapper .icon-wrapper .md-icon{width:32px;height:32px;font-size:32px;line-height:32px}.md-steps .step-wrapper .text-wrapper{position:absolute}.md-steps .step-wrapper .text-wrapper .desc,.md-steps .step-wrapper .text-wrapper .name{white-space:nowrap}.md-steps .step-wrapper .text-wrapper .name{line-height:28px;font-size:28px}.md-steps .step-wrapper .text-wrapper .desc{line-height:28px;font-size:26px}.md-steps .step-wrapper.current .icon-wrapper,.md-steps .step-wrapper.reached .icon-wrapper{color:#198cff}.md-steps .step-wrapper.current .icon-wrapper .step-node-default-icon,.md-steps .step-wrapper.reached .icon-wrapper .step-node-default-icon{background:#198cff}.md-steps .bar{position:relative;background-color:#e2e4ea;overflow:hidden}.md-steps .bar .bar-inner{z-index:10;position:absolute;top:0;left:0;display:block;content:"";-webkit-transition:all 1s linear;transition:all 1s linear}.md-steps .bar.horizontal-bar{-webkit-box-flex:1;-webkit-flex:1;flex:1;height:1px}.md-steps .bar.horizontal-bar .bar-inner{width:100%;height:1px;background-color:#198cff}.md-steps .bar.vertical-bar{left:16px;width:1px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.md-steps .bar.vertical-bar .bar-inner{width:1px;height:100%;background-color:#198cff}.md-steps .bar:last-of-type.horizontal-bar{display:none}.md-steps .bar:last-of-type.vertical-bar{visibility:hidden}