diff --git a/src/components/supply/ReminderKpiBar.tsx b/src/components/supply/ReminderKpiBar.tsx
index ca61e29..cd61328 100644
--- a/src/components/supply/ReminderKpiBar.tsx
+++ b/src/components/supply/ReminderKpiBar.tsx
@@ -21,41 +21,26 @@ function KpiCard({ icon, label, value, color, active, onClick }: KpiCardProps) {
onClick={onClick}
sx={{
flex: 1,
- p: 1.5,
+ px: 1.5,
+ py: 1.125,
display: 'flex',
alignItems: 'center',
- gap: 1.5,
- border: active ? `2px solid ${color}` : '1px solid #e2e8f0',
+ gap: 1,
+ border: active ? `1.5px solid ${color}` : '1px solid #e8e7e4',
borderRadius: 1.5,
- bgcolor: active ? `${color}10` : 'white',
+ bgcolor: active ? `${color}08` : 'white',
cursor: 'pointer',
- transition: 'all 0.15s',
+ transition: 'border-color 0.15s, background 0.15s',
minWidth: 0,
- '&:hover': {
- bgcolor: `${color}0d`,
- borderColor: color,
- },
+ '&:hover': { bgcolor: `${color}06`, borderColor: color },
}}
>
-
- {icon}
-
+ {icon}
-
+
{value}
-
+
{label}
diff --git a/src/components/supply/ReminderListRow.tsx b/src/components/supply/ReminderListRow.tsx
index 4a90d75..13cea0c 100644
--- a/src/components/supply/ReminderListRow.tsx
+++ b/src/components/supply/ReminderListRow.tsx
@@ -16,20 +16,20 @@ const PRIORITY_BORDER: Record = {
[ReminderPriority.LOW]: 'transparent',
}
-const STATUS_CHIP_COLOR: Record = {
- ACTIVE: 'info',
- SNOOZED: 'warning',
- COMPLETED: 'success',
- DISMISSED: 'default',
-}
-
const STATUS_LABEL: Record = {
- ACTIVE: 'Aktiv',
- SNOOZED: 'Schlummernd',
+ ACTIVE: 'Aktiv',
+ SNOOZED: 'Schlummernd',
COMPLETED: 'Erledigt',
DISMISSED: 'Verworfen',
}
+const STATUS_STYLE: Record = {
+ ACTIVE: { bg: '#f0fdf4', color: '#15803d', border: '#bbf7d0' },
+ SNOOZED: { bg: '#fefce8', color: '#92400e', border: '#fde68a' },
+ COMPLETED: { bg: '#f8fafc', color: '#475569', border: '#e2e8f0' },
+ DISMISSED: { bg: '#f8fafc', color: '#94a3b8', border: '#e8e7e4' },
+}
+
interface Props {
reminder: Reminder
}
@@ -121,9 +121,15 @@ export const ReminderListRow = memo(function ReminderListRow({ reminder }: Props