<template>
	<div class="serenity__progress-bar">
		<div class="serenity__progress-bar__value" :style="`width: ${value}%`"></div>
	</div>
</template>

<script>
export default {
	props: {
		value: String,
	},
};
</script>

<style lang="scss" scoped>
.serenity__progress-bar {
	height: 4px;
	// background: #28aead;
	background: #f1f2fb;

	> .serenity__progress-bar__value {
		width: 0;
		height: inherit;
		background: #28aead;
	}
}
</style>
