@gits-id/progress-bar/dist/style.css

GITS Progress Bar Component

:root{--v-progress-bar-bg-color: #e5e7eb;--v-progress-bar-fill-color: #9ca3af;--v-progress-bar-height: .5rem;--v-progress-bar-border-radius: 9999px;--v-progress-bar-font-size: .75rem;--v-progress-bar-label-color: #fff;--v-progress-bar-transition-property: all;--v-progress-bar-transition-duration: .3s;--v-progress-bar-transition-timing-function: cubic-bezier(.4, 0, .2, 1);--v-progress-bar-indeterminate-animation-name: indeterminateAnimation;--v-progress-bar-indeterminate-animation-duration: 2s;--v-progress-bar-indeterminate-animation-timing-function: linear;--v-progress-bar-indeterminate-animation-iteration-count: infinite}.v-progress-bar{position:relative;font-size:var(--v-progress-bar-font-size)}.v-progress-bar-background{height:var(--v-progress-bar-height);background-color:var(--v-progress-bar-bg-color);border-radius:var(--v-progress-bar-border-radius);display:flex;overflow:hidden}.v-progress-bar-fill{background-color:var(--v-progress-bar-fill-color);border-radius:var(--v-progress-bar-border-radius);transition-property:var(--v-progress-bar-transition-property);transition-duration:var(--v-progress-bar-transition-duration);transition-timing-function:var(--v-progress-bar-transition-timing-function);display:flex;flex-direction:column;align-items:center;justify-content:center}.v-progress-bar-primary{--v-progress-bar-fill-color: #28A0F6}.v-progress-bar-secondary{--v-progress-bar-fill-color: #FF8B49}.v-progress-bar-info{--v-progress-bar-fill-color: #0ea5e9}.v-progress-bar-warning{--v-progress-bar-fill-color: #eab308}.v-progress-bar-success{--v-progress-bar-fill-color: #10b981}.v-progress-bar-error{--v-progress-bar-fill-color: #f43f5e}.v-progress-bar-dark{--v-progress-bar-fill-color: #1f2937}.v-progress-bar-label{color:var(--v-progress-bar-label-color);position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.v-progress-bar-label:empty{display:none}.v-progress-bar--indeterminate .v-progress-bar-fill{animation-name:var(--v-progress-bar-indeterminate-animation-name);animation-duration:var(--v-progress-bar-indeterminate-animation-duration);animation-iteration-count:var(--v-progress-bar-indeterminate-animation-iteration-count);animation-timing-function:var(--v-progress-bar-indeterminate-animation-timing-function);transform-origin:0% 50%;width:100%}@keyframes indeterminateAnimation{0%{transform:translate(0) scaleX(0)}40%{transform:translate(0) scaleX(.4)}to{transform:translate(100%) scaleX(.5)}}.dark .v-progress-bar{--v-progress-bar-bg-color: #737373;--v-progress-bar-label-color: #e5e5e5}.dark .v-progress-bar-default{--v-progress-bar-fill-color: #404040}