UI fixes: emoji icons, modal form, Czech labels, polish

- Fixed group emoji icons in DB (💼🛒📚🗺️🏃🏠🌿)
- Added TaskModal component for + button
- Czech status labels (Čeká, Probíhá, Hotovo, Zrušeno)
- Improved TaskCard, GroupSelector, Header, StatusBadge
- Better dark/light mode transitions

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude CLI Agent
2026-03-29 11:16:07 +00:00
parent 6c93ae04d0
commit 4a6b5e5498
11 changed files with 499 additions and 163 deletions

View File

@@ -5,11 +5,37 @@ interface StatusBadgeProps {
size?: "sm" | "md";
}
const STATUS_MAP: Record<string, { label: string; bg: string; text: string }> = {
pending: { label: "Ceka", bg: "bg-yellow-100 dark:bg-yellow-900/30", text: "text-yellow-800 dark:text-yellow-300" },
in_progress: { label: "Probiha", bg: "bg-blue-100 dark:bg-blue-900/30", text: "text-blue-800 dark:text-blue-300" },
done: { label: "Hotovo", bg: "bg-green-100 dark:bg-green-900/30", text: "text-green-800 dark:text-green-300" },
cancelled: { label: "Zruseno", bg: "bg-gray-100 dark:bg-gray-800/30", text: "text-gray-600 dark:text-gray-400" },
const STATUS_MAP: Record<string, { label: string; bg: string; text: string; dot: string }> = {
pending: {
label: "\u010Cek\u00e1",
bg: "bg-yellow-100 dark:bg-yellow-900/30",
text: "text-yellow-800 dark:text-yellow-300",
dot: "bg-yellow-500",
},
in_progress: {
label: "Prob\u00edh\u00e1",
bg: "bg-blue-100 dark:bg-blue-900/30",
text: "text-blue-800 dark:text-blue-300",
dot: "bg-blue-500",
},
done: {
label: "Hotovo",
bg: "bg-green-100 dark:bg-green-900/30",
text: "text-green-800 dark:text-green-300",
dot: "bg-green-500",
},
completed: {
label: "Hotovo",
bg: "bg-green-100 dark:bg-green-900/30",
text: "text-green-800 dark:text-green-300",
dot: "bg-green-500",
},
cancelled: {
label: "Zru\u0161eno",
bg: "bg-gray-100 dark:bg-gray-800/30",
text: "text-gray-600 dark:text-gray-400",
dot: "bg-gray-400",
},
};
export default function StatusBadge({ status, size = "sm" }: StatusBadgeProps) {
@@ -17,7 +43,10 @@ export default function StatusBadge({ status, size = "sm" }: StatusBadgeProps) {
const sizeClass = size === "sm" ? "px-2 py-0.5 text-xs" : "px-3 py-1 text-sm";
return (
<span className={`inline-flex items-center rounded-full font-medium ${s.bg} ${s.text} ${sizeClass}`}>
<span
className={`inline-flex items-center gap-1.5 rounded-full font-medium ${s.bg} ${s.text} ${sizeClass}`}
>
<span className={`w-1.5 h-1.5 rounded-full ${s.dot}`} />
{s.label}
</span>
);