@shopify/polaris/build/esnext/components/ProgressBar/ProgressBar.css

Shopify’s admin product component library

@keyframes Polaris-ProgressBar--fillup_v0nyp { 0% { width: 0; } }

.Polaris-ProgressBar_17609 { overflow: hidden; width: 100%; background-color: var(--p-progressbar-background); border-radius: var(--p-border-radius-base); }

@media (forced-colors: active) { .Polaris-ProgressBar_17609 { border: 0.0625rem solid transparent; } }

.Polaris-ProgressBar--sizeSmall_7647q { height: 0.5rem; }

.Polaris-ProgressBar--sizeMedium_5f35p { height: 1rem; }

.Polaris-ProgressBar--sizeLarge_61dxo { height: 2rem; }

.Polaris-ProgressBar--colorHighlight_2qv4t { --p-progressbar-background: var(--p-surface-neutral); --p-progressbar-indicator: var(--p-border-highlight); }

.Polaris-ProgressBar--colorPrimary_4ruww { --p-progressbar-background: var(--p-surface-neutral); --p-progressbar-indicator: var(--p-action-primary); }

.Polaris-ProgressBar--colorSuccess_k0sue { --p-progressbar-background: var(--p-surface-neutral); --p-progressbar-indicator: var(--p-border-success); }

.Polaris-ProgressBar--colorCritical_glskc { --p-progressbar-background: var(--p-surface-neutral); --p-progressbar-indicator: var(--p-interactive-critical); }

.Polaris-ProgressBar__Indicator_dw7mr { height: inherit; width: 0; background-color: var(--p-progressbar-indicator); }

@media screen and (-ms-high-contrast: active) { .Polaris-ProgressBar__Indicator_dw7mr { border: 1rem solid highlight; } }

.Polaris-ProgressBar__Animated_mk149 { -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: width; animation: Polaris-ProgressBar--fillup_v0nyp 500ms cubic-bezier(0.25, 0.1, 0.25, 1); transition: width 500ms cubic-bezier(0.25, 0.1, 0.25, 1); }

.Polaris-ProgressBar__Progress_ixe53, .Polaris-ProgressBar__Label_2vd36 { position: absolute !important; width: 0.0625rem !important; height: 0.0625rem !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; -webkit-clip-path: inset(50%) !important; clip-path: inset(50%) !important; border: 0 !important; white-space: nowrap !important; }