diff --git a/backend/src/routes/dashboard.ts b/backend/src/routes/dashboard.ts index 5ba8a94..ef5d25e 100644 --- a/backend/src/routes/dashboard.ts +++ b/backend/src/routes/dashboard.ts @@ -53,13 +53,13 @@ router.get('/', async (req: Request, res: Response): Promise => { `SELECT CASE WHEN t.id IS NOT NULL THEN true ELSE false END AS has_tip FROM matches m LEFT JOIN tips t ON t.match_id = m.id AND t.user_id = $1 - WHERE m.utc_date <= NOW() AND m.status IN ('FINISHED', 'IN_PLAY') + WHERE m.status IN ('FINISHED', 'IN_PLAY') ORDER BY m.utc_date DESC`, [userId] ); let streak = 0; for (const m of pastMatches) { - if (m.has_tip) streak++; + if (m.has_tip === true || (m.has_tip as unknown) === 't' || (m.has_tip as unknown) === '1') streak++; else break; } diff --git a/frontend/src/components/MatchCard.module.css b/frontend/src/components/MatchCard.module.css index c1f0e66..ef74645 100644 --- a/frontend/src/components/MatchCard.module.css +++ b/frontend/src/components/MatchCard.module.css @@ -341,43 +341,46 @@ /* Farb-Varianten Banner */ .exact { - background: linear-gradient(90deg, rgba(52,211,153,0.18) 0%, rgba(52,211,153,0.08) 100%); - color: #4ade80; - border-top: 1px solid rgba(52,211,153,0.20); + background: linear-gradient(90deg, rgba(254,174,50,0.22) 0%, rgba(254,174,50,0.09) 100%); + color: #FECC4C; + border-top: 1px solid rgba(254,174,50,0.30); } .tendency { - background: linear-gradient(90deg, rgba(75,183,248,0.18) 0%, rgba(75,183,248,0.08) 100%); - color: var(--primary); - border-top: 1px solid rgba(75,183,248,0.20); + background: linear-gradient(90deg, rgba(52,211,153,0.18) 0%, rgba(52,211,153,0.08) 100%); + color: #4ade80; + border-top: 1px solid rgba(52,211,153,0.22); } .wrong { - background: linear-gradient(90deg, rgba(248,113,113,0.15) 0%, rgba(248,113,113,0.06) 100%); - color: var(--error); - border-top: 1px solid rgba(248,113,113,0.18); + background: linear-gradient(90deg, rgba(148,163,184,0.12) 0%, rgba(148,163,184,0.05) 100%); + color: var(--text-muted); + border-top: 1px solid rgba(148,163,184,0.15); } /* Card-Glow je Ergebnis */ .glowExact { box-shadow: - 0 0 0 1px rgba(52,211,153,0.18), - 0 10px 30px rgba(52,211,153,0.07), - inset 0 1px 0 rgba(255,255,255,0.07) !important; + 0 0 0 1.5px rgba(254,174,50,0.40), + 0 0 20px rgba(254,174,50,0.18), + 0 10px 30px rgba(254,174,50,0.10), + inset 0 1px 0 rgba(255,255,255,0.09) !important; + border-color: rgba(254,174,50,0.35) !important; } .glowTendency { box-shadow: - 0 0 0 1px rgba(75,183,248,0.18), - 0 10px 30px rgba(75,183,248,0.07), + 0 0 0 1px rgba(52,211,153,0.28), + 0 10px 30px rgba(52,211,153,0.10), inset 0 1px 0 rgba(255,255,255,0.07) !important; } .glowWrong { box-shadow: - 0 0 0 1px rgba(248,113,113,0.15), - 0 10px 30px rgba(248,113,113,0.05), - inset 0 1px 0 rgba(255,255,255,0.07) !important; + 0 0 0 1px rgba(148,163,184,0.15), + 0 10px 20px rgba(0,0,0,0.08), + inset 0 1px 0 rgba(255,255,255,0.05) !important; + opacity: 0.85; } .editBtn { @@ -493,19 +496,23 @@ } .pointsBadge_exact { - background: linear-gradient(135deg, var(--gold), #FFD700); + background: linear-gradient(135deg, #FEAE32, #FFD700, #FECC4C); color: #1a1a1a; - animation: shimmer 2s ease-in-out; + font-size: 0.9rem; + padding: 5px 12px; + box-shadow: 0 0 12px rgba(254,174,50,0.45); + animation: shimmer 2.5s ease-in-out infinite; } .pointsBadge_tendency { - background: var(--success); - color: #1a1a1a; + background: linear-gradient(135deg, var(--success), #22c55e); + color: #0a2a1a; } .pointsBadge_wrong { - background: var(--text-muted); - color: var(--bg-deep); + background: var(--surface-high); + color: var(--text-muted); + border: 1px solid var(--border-subtle); } /* Missed label */ diff --git a/frontend/src/components/MatchCard.tsx b/frontend/src/components/MatchCard.tsx index 6f0a8b9..220e6da 100644 --- a/frontend/src/components/MatchCard.tsx +++ b/frontend/src/components/MatchCard.tsx @@ -182,7 +182,7 @@ export default function MatchCard({ match, onTip }: Props) { } - {points === 3 ? 'Exakt' : points === 1 ? 'Tendenz' : 'Falsch'} + {points === 3 ? '🏆 Exakt' : points === 1 ? 'Tendenz' : 'Falsch'} diff --git a/frontend/src/pages/ProfilePage.module.css b/frontend/src/pages/ProfilePage.module.css index ad7cc74..108fd2d 100644 --- a/frontend/src/pages/ProfilePage.module.css +++ b/frontend/src/pages/ProfilePage.module.css @@ -186,9 +186,21 @@ color: var(--text-muted); } -.badgeExact { background: rgba(255,196,0,0.15); color: var(--gold); } -.badgeTendency { background: rgba(34,197,94,0.15); color: var(--success); } -.badgeWrong { background: rgba(239,68,68,0.12); color: var(--error); } +.badgeExact { + background: linear-gradient(135deg, #FEAE32, #FFD700); + color: #1a1a1a; + box-shadow: 0 0 8px rgba(254,174,50,0.35); +} +.badgeTendency { + background: rgba(34,197,94,0.22); + color: #4ade80; + border: 1px solid rgba(34,197,94,0.30); +} +.badgeWrong { + background: var(--surface-high); + color: var(--text-muted); + border: 1px solid var(--border-subtle); +} /* ── Fun stats ── */ .funStats { display: flex; flex-direction: column; gap: 12px; }