fix: progress bar background color

frappe/public/js/frappe/list/list_view.js

@@ -692,7 +692,7 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
 			if (df.fieldtype === "Code") {
 				return value;
 			} else if (df.fieldtype === "Percent") {
-				return `<div class="progress level" style="margin: 0px;">
+				return `<div class="progress" style="margin: 0px;">
 						<div class="progress-bar progress-bar-success" role="progressbar"
 							aria-valuenow="${value}"
 							aria-valuemin="0" aria-valuemax="100" style="width: ${Math.round(value)}%;">

frappe/public/less/desk.less

@@ -180,27 +180,6 @@ textarea.form-control {
 // 	min-height: 11.69in;
 // }
 
-.progress, .progress-bar {
-	box-shadow: none;
-}
-
-a.progress-small {
-	.progress-chart {
-		width: 40px;
-		margin-top: 4px;
-		float: right;
-	}
-
-	.progress {
-		margin-bottom: 0;
-	}
-
-	.progress-bar {
-		transition: unset;
-		background-color: #98d85b;
-	}
-}
-
 li.user-progress {
 	.progress-chart {
 		width: 50px;

frappe/public/scss/desk/controls.scss

@@ -174,4 +174,38 @@
 		border-radius: var(--border-radius);
 		font-size: var(--text-md);
 	}
+}
+
+/* progress bar */
+.progress, .progress-bar {
+	box-shadow: none;
+}
+
+a.progress-small {
+	.progress-chart {
+		width: 40px;
+		margin-top: 4px;
+		float: right;
+	}
+
+	.progress {
+		margin-bottom: 0;
+	}
+
+	.progress-bar {
+		transition: unset;
+		background-color: var(--green-500);
+	}
+}
+
+.progress-bar-success {
+	background-color: var(--green-500);
+}
+
+.progress-bar-danger {
+	background-color: var(--red-500);
+}
+
+.progress-bar-warning {
+	background-color: var(--orange-500);
 }