# elasticpress/4.6.0/assets/css/sync/progress-bar.css

ElasticPress, version 4.6.0. 32 lines.

- Page: https://pluginprobe.com/plugins/elasticpress/4.6.0/code/assets/css/sync/progress-bar.css
- Raw: https://pluginprobe.com/plugins/elasticpress/4.6.0/raw/assets/css/sync/progress-bar.css
- Modified: 2023-01-10T18:12:08+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/elasticpress/4.6.0/code/assets/css/sync/progress-bar.css#L10-L20`.

```css
.ep-sync-progress-bar {
	background: var(--ep-sync-color-light-grey);
	display: flex;
	overflow: hidden;
	text-align: center;
}

.ep-sync-progress-bar,
.ep-sync-progress-bar__progress {
	border-radius: 0.875em;
}

.ep-sync-progress-bar__progress {
	background: var(--wp-admin-theme-color);
	color: var(--ep-sync-color-white);
	padding: 0 0.875em;
	transition: all 500ms ease-in-out;
	white-space: nowrap;

	@nest .ep-sync-progress-bar--complete & {
		background: var(--ep-sync-color-success);
	}

	@nest .ep-sync-progress-bar--paused & {
		opacity: 0.5;
	}

	@nest .ep-sync-progress-bar--failed & {
		background: var(--ep-sync-color-error);
	}
}

```
