Fix progress bar color when checking files

This commit is contained in:
Igor Katson 2024-01-02 18:43:25 +00:00
parent 51ed57a74d
commit 0ff63d8a24
No known key found for this signature in database
GPG key ID: B4EC22B66D61A3F5
3 changed files with 21 additions and 18 deletions

File diff suppressed because one or more lines are too long

View file

@ -11,7 +11,7 @@
"css": [ "css": [
"assets/index-d46108e9.css" "assets/index-d46108e9.css"
], ],
"file": "assets/index-e6c23bc1.js", "file": "assets/index-b218d1f9.js",
"isEntry": true, "isEntry": true,
"src": "index.html" "src": "index.html"
} }

View file

@ -4,20 +4,23 @@ type Props = {
variant?: "warn" | "info" | "success" | "error"; variant?: "warn" | "info" | "success" | "error";
}; };
const variantClassNames = {
warn: "bg-amber-500 text-white",
info: "bg-blue-500 text-white",
success: "bg-green-700 text-white",
error: "bg-red-500 text-white",
};
export const ProgressBar = ({ now, variant, label }: Props) => { export const ProgressBar = ({ now, variant, label }: Props) => {
const progressLabel = label ?? `${now.toFixed(2)}%`; const progressLabel = label ?? `${now.toFixed(2)}%`;
const variantClassName = { const variantClassName =
warn: "bg-amber-500", variantClassNames[variant ?? "info"] ?? variantClassNames["info"];
info: "bg-blue-500 text-white",
success: "bg-green-700 text-white",
error: "bg-red-500 text-white",
}[variant ?? "info"];
return ( return (
<div className={"w-full bg-gray-200 rounded-full dark:bg-gray-500"}> <div className={"w-full bg-gray-200 rounded-full dark:bg-gray-500"}>
<div <div
className={`text-xs bg-blue-500 text-white font-medium transition-all text-center p-0.5 leading-none rounded-full ${variantClassName}`} className={`text-xs font-medium transition-all text-center p-0.5 leading-none rounded-full ${variantClassName}`}
style={{ width: `${now}%` }} style={{ width: `${now}%` }}
> >
{progressLabel} {progressLabel}