chore(progress): cleanup unused css

src/components/misc/ProgressBar.vue

@@ -33,33 +33,47 @@ defineProps({
 
 <style lang="scss" scoped>
 .progress-bar {
-	--progress-height: var(--size-normal, #{$size-normal});
+	--progress-height: #{$size-normal};
 	--progress-bar-background-color: var(--border-light, #{$border-light});
 	--progress-value-background-color: var(--grey-500, #{$text});
 	--progress-border-radius: var(--radius-rounded, #{$radius-rounded});
 	--progress-indeterminate-duration: 1.5s;
 
-	--size-small: #{$size-small};
-	--size-medium: #{$size-medium};
-	--size-large: #{$size-large};
-
 	appearance: none;
 	border: none;
 	border-radius: var(--progress-border-radius);
 	height: var(--progress-height);
 	overflow: hidden;
 	padding: 0;
-	margin-bottom: 0;
+	min-width: 6vw;
+
+	width: 50px;
+	margin: 0 .5rem 0 0;
+	flex: 3 1 auto;
+
+	&::-moz-progress-bar,
+	&::-webkit-progress-value {
+		background: var(--progress-value-background-color);
+	}
+
+	@media screen and (max-width: $tablet) {
+		margin: 0.5rem 0 0 0;
+		order: 1;
+		width: 100%;
+	}
 
 	&::-webkit-progress-bar {
 		background-color: var(--progress-bar-background-color);
 	}
+
 	&::-webkit-progress-value {
 		background-color: var(--progress-value-background-color);
 	}
+
 	&::-moz-progress-bar {
 		background-color: var(--progress-value-background-color);
 	}
+
 	&::-ms-fill {
 		background-color: var(--progress-value-background-color);
 		border: none;
@@ -69,23 +83,13 @@ defineProps({
 	@each $name, $pair in $colors {
 		$color: nth($pair, 1);
 		&.is-#{$name} {
-			&::-webkit-progress-value {
+			--progress-value-background-color: var(--#{$name}, #{$color});
-				--progress-value-background-color: var(--#{$name}, #{$color});
-			}
-
-			&::-moz-progress-bar {
-				--progress-value-background-color: var(--#{$name}, #{$color});
-			}
-
-			&::-ms-fill {
-				--progress-value-background-color: var(--#{$name}, #{$color});
-			}
 
 			&:indeterminate {
 				background-image: linear-gradient(
-					to right,
+						to right,
-					var(--#{$name}, #{$color}) 30%,
+						var(--#{$name}, #{$color}) 30%,
-					var(--progress-bar-background-color) 30%
+						var(--progress-bar-background-color) 30%
 				);
 			}
 		}
@@ -98,9 +102,9 @@ defineProps({
 		animation-timing-function: linear;
 		background-color: var(--progress-bar-background-color);
 		background-image: linear-gradient(
-			to right,
+				to right,
-			var(--text, #{$text}) 30%,
+				var(--text, #{$text}) 30%,
-			var(--progress-bar-background-color) 30%
+				var(--progress-bar-background-color) 30%
 		);
 		background-position: top left;
 		background-repeat: no-repeat;
@@ -119,15 +123,8 @@ defineProps({
 		}
 	}
 
-	// Sizes
 	&.is-small {
-		--progress-height: var(--size-small, #{$size-small});
+		--progress-height: #{$size-small};
-	}
-	&.is-medium {
-		--progress-height: var(--size-medium, #{$size-medium});
-	}
-	&.is-large {
-		--progress-height: var(--size-large, #{$size-large});
 	}
 }
 
@@ -139,34 +136,4 @@ defineProps({
 		background-position: -200% 0;
 	}
 }
-
-.progress-bar {
-	--progress-height: var(--size-normal, 1rem);
-
-	border-radius: $radius-large;
-	min-width: 6vw;
-
-	@media screen and (max-width: $tablet) {
-		width: 100%;
-	}
-
-	&::-moz-progress-bar,
-	&::-webkit-progress-value {
-		background: var(--progress-value-background-color);
-	}
-
-	width: 50px;
-	margin: 0 0.5rem 0 0;
-	flex: 3 1 auto;
-
-	@media screen and (max-width: $tablet) {
-		margin: 0.5rem 0 0 0;
-		order: 1;
-		width: 100%;
-	}
-}
-
-.progress-bar.is-small {
-	--progress-height: var(--size-small, 0.75rem);
-}
 </style>

src/components/tasks/partials/kanban-card.vue

@@ -46,7 +46,6 @@
 				class="task-progress"
 				v-if="task.percentDone > 0"
 				:value="task.percentDone * 100"
-				is-small
 			/>
 
 			<div class="footer">