feat(frontend): Icon-Badges auf Detailseiten-Karten (Volk/Bienenstand/Königin)
Header von ColonyEditCard, ApiaryEditCard und QueenEditCard um Icon-Badge im Honig-/Salbei-Gradient ergänzt, passend zum bereits überarbeiteten Look der Listen- und Übersichtsseiten. Zusätzlich Bug behoben: ColonyEditCard und QueenEditCard nutzten bislang ein hartcodiertes ACTIVE-Ternary statt der gemeinsamen statusTone()-Hilfsfunktion, wodurch z. B. WEAK/CONSPICUOUS/DISSOLVED-Völker und LOST/DECEASED-Königinnen auf der eigenen Detailseite nur als neutrales "secondary"-Badge statt in Warn-/Fehlerfarbe erschienen.
This commit is contained in:
1 parent
6c764bf885
commit
5be352c4a0
3 files changed
+34
-9
No files matched your search
@@ -1,6 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import { FormEvent, useState } from "react";
|
||||
import { MapPin } from "lucide-react";
|
||||
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
||||
import { toast } from "sonner";
|
||||
import { deactivateApiary, reactivateApiary, updateApiary } from "@/lib/apiaries/api";
|
||||
@@ -66,7 +67,15 @@ export function ApiaryEditCard({ apiary }: { apiary: Apiary }) {
|
||||
return (
|
||||
<Card className="max-w-lg">
|
||||
<CardHeader className="flex flex-row items-center justify-between">
|
||||
<CardTitle>{apiary.name}</CardTitle>
|
||||
<div className="flex items-center gap-2.5">
|
||||
<span
|
||||
className="flex size-8 items-center justify-center rounded-lg text-white shadow-[var(--shadow-soft)]"
|
||||
style={{ background: "var(--gradient-honey)" }}
|
||||
>
|
||||
<MapPin className="size-4" />
|
||||
</span>
|
||||
<CardTitle>{apiary.name}</CardTitle>
|
||||
</div>
|
||||
<Badge variant={apiary.status === "ACTIVE" ? "default" : "secondary"}>
|
||||
{apiary.status === "ACTIVE" ? "Aktiv" : "Inaktiv"}
|
||||
</Badge>
|
||||
|
||||
Reference in new issue
Block a user