@gravityforms/components/css/admin/progressbar/simple.css

UI components for use in Gravity Forms development. Both React and vanilla js flavors.

.gform-admin {

	.gform-progress-bar {

		* {
			box-sizing: border-box;
		}
	}

	.gform-progress-bar--size-regular {

		.gform-progress-bar__track {
			block-size: 12px;
			border-radius: 6px;
		}

		.gform-progress-bar__fill {
			block-size: 12px;
			border-radius: 6px;
		}
	}

	.gform-progress-bar__track {
		background-color: var(--gform-admin-color-porcelain-gray);
		block-size: 100%;
	}

	.gform-progress-bar__fill {
		background-color: var(--gform-admin-color-blue-ribbon);
		block-size: 100%;
	}

	.gform-progress-bar__label {
		block-size: 100%;
		display: flex;
		justify-content: flex-end;
		margin-block-start: var(--gform-admin-spacer-2);
	}

	.gform-progress-bar__label-inner {
		color: var(--gform-admin-color-comet);
		font-family: var(--gform-admin-font-family-base);
		font-size: var(--gform-admin-font-size-sm);
		font-weight: var(--gform-admin-font-weight-medium);
	}

}