byted-vui
Version:
A Component Library for Vue.js.
1 lines • 1.84 kB
CSS
.vi-progress{position:relative;line-height:1}.vi-progress__text{font-size:14px;color:#606266;display:inline-block;vertical-align:middle;margin-left:10px;line-height:1}.vi-progress__text i{vertical-align:middle;display:block}.vi-progress--circle{display:inline-block}.vi-progress--circle .vi-progress__text{position:absolute;top:50%;left:0;width:100%;text-align:center;margin:0;-webkit-transform:translate(0,-50%);transform:translate(0,-50%)}.vi-progress--circle .vi-progress__text i{vertical-align:middle;display:inline-block}.vi-progress--without-text .vi-progress__text{display:none}.vi-progress--without-text .vi-progress-bar{padding-right:0;margin-right:0;display:block}.vi-progress-bar,.vi-progress-bar__inner::after,.vi-progress-bar__innerText{display:inline-block;vertical-align:middle}.vi-progress--text-inside .vi-progress-bar{padding-right:0;margin-right:0}.vi-progress.is-success .vi-progress-bar__inner{background-color:#67c23a}.vi-progress.is-success .vi-progress__text{color:#67c23a}.vi-progress.is-exception .vi-progress-bar__inner{background-color:#f56c6c}.vi-progress.is-exception .vi-progress__text{color:#f56c6c}.vi-progress-bar{padding-right:50px;width:100%;margin-right:-55px;-webkit-box-sizing:border-box;box-sizing:border-box}.vi-progress-bar__outer{height:6px;border-radius:100px;background-color:#ebeef5;overflow:hidden;position:relative;vertical-align:middle}.vi-progress-bar__inner{position:absolute;left:0;top:0;height:100%;background-color:#445D89;text-align:right;border-radius:100px;line-height:1;white-space:nowrap}.vi-progress-bar__inner::after{content:"";height:100%}.vi-progress-bar__innerText{color:#fff;font-size:12px;margin:0 5px}@-webkit-keyframes progress{0%{background-position:0 0}100%{background-position:32px 0}}@keyframes progress{0%{background-position:0 0}100%{background-position:32px 0}}