From b8ed8da199e372a704c2b457c49549e396e44e66 Mon Sep 17 00:00:00 2001 From: JMARyA Date: Sun, 23 Feb 2025 04:34:21 +0100 Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20progressbar?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/ui/components/mod.rs | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/src/ui/components/mod.rs b/src/ui/components/mod.rs index 817e002..3f6eba6 100644 --- a/src/ui/components/mod.rs +++ b/src/ui/components/mod.rs @@ -555,16 +555,24 @@ pub fn HelpIcon() -> PreEscaped { } #[allow(non_snake_case)] -pub fn ProgressBar(percentage: u8, label: bool) -> PreEscaped { - assert!(percentage < 100, "Percentage must be less than 100"); +pub fn ProgressBar( + mut percentage: u8, + label: bool, + color: C, +) -> PreEscaped { + if percentage > 100 { + percentage = 100; + } + + let color = color.color_class(); html! { @if label { div class="w-full bg-gray-200 rounded-full dark:bg-gray-700" { - div class="bg-blue-600 text-xs font-medium text-blue-100 text-center p-0.5 leading-none rounded-full" style=(format!("width: {percentage}%")) { (format!("{percentage}%")) }; + div class=(format!("bg-{color} text-xs font-medium text-blue-100 text-center p-0.5 leading-none rounded-full")) style=(format!("width: {percentage}%")) { (format!("{percentage}%")) }; }; } @else { div class="w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700" { - div class="bg-blue-600 h-2.5 rounded-full" style=(format!("width: {percentage}%")) {}; + div class=(format!("bg-{color} h-2.5 rounded-full")) style=(format!("width: {percentage}%")) {}; }; } }