server side events and ui improvemnt

This commit is contained in:
Carl-Gerhard Lindesvärd
2024-02-09 15:05:59 +01:00
parent 04453c673f
commit 484a6b1d41
73 changed files with 1095 additions and 650 deletions

View File

@@ -25,7 +25,7 @@ export function MetricCard({
const number = useNumber();
return (
<div
className="group relative border border-border p-4 rounded-md bg-white overflow-hidden"
className="group relative border border-border p-4 rounded-md bg-white overflow-hidden h-24"
key={serie.name}
>
<div className="absolute -top-1 -left-1 -right-1 -bottom-1 z-0 opacity-10 transition-opacity duration-300 group-hover:opacity-50">
@@ -79,3 +79,22 @@ export function MetricCard({
</div>
);
}
export function MetricCardEmpty() {
return (
<div className="border border-border p-4 rounded-md bg-white h-24">
<div className="flex items-center justify-center h-full text-slate-600">
No data
</div>
</div>
);
}
export function MetricCardLoading() {
return (
<div className="h-24 p-4 py-5 flex flex-col bg-white border border-border rounded-md">
<div className="bg-slate-200 rounded animate-pulse h-4 w-1/2"></div>
<div className="bg-slate-200 rounded animate-pulse h-6 w-1/5 mt-auto"></div>
</div>
);
}