Yumder · In-Swipe-Buttons

Spec-Mockup für die Buttons auf dem Swipe-Screen. Ziel: halbtransparente Ränder/Füllungen entfernen und mit klaren Farben arbeiten – konsistent zur Startseite/Einstellungen/Matches.

1 · Aktions-Buttons (Nein / Veto / Ja + Undo / Info)

Heute: bg-neutral-800 (deckend), aber halbtransparente Farb-Ränder (border-red-400/60, border-green-400/80, border-amber-500/80, border-violet-400/60, border-white/20).

VORHER

neutral-800 + Farbrand mit Opacity

↶

🛡

✓

NACHHER · Variante A

volle Farbe, weißes/dunkles Icon

↶

🛡

✓

NACHHER · Variante B

neutral-800, aber Rand deckend

↶

🛡

✓

EMPFEHLUNG

Variante A (volle Farbe) passt zum neuen Stil von Herz/Joker & „Daten zurücksetzen".
Ja: bg-green-500 text-white
Nein: bg-red-500 text-white
Veto: bg-amber-500 text-black
Undo: bg-violet-500 text-white
Info: bg-neutral-600 text-white

FORM-FRAGE

Aktuell sind alle Aktions-Buttons Kreise (`rounded-full`) – im Rest der App nutzen wir `rounded-xl`.

Sollen die Swipe-Buttons Kreise bleiben (übliches Swipe-Muster) oder auf rounded-xl/rounded-2xl wechseln? Bitte entscheiden.

2 · Restliche halbtransparente Flächen auf dem Swipe-Screen

Element	VORHER	NACHHER
Session-Code-Pille	`bg-neutral-900/50`	`bg-neutral-900`
Info-Button (oben rechts)	`bg-neutral-900/70 + backdrop-blur-md`	`bg-neutral-900`
Toast (neutral)	`bg-neutral-800/80`	`bg-neutral-800`
Toast (teal)	`bg-yumder-teal/15 border-yumder-teal/30`	`bg-yumder-teal text-neutral-900`
Karten-Rahmen	`bg-neutral-900/60 + backdrop-blur-xl`	`bg-neutral-900`
Öffnungsstatus-Pille (offen)	`bg-yumder-teal/15 border-yumder-teal/30`	`bg-yumder-teal text-neutral-900`
Öffnungsstatus-Pille (zu)	`bg-red-400/15 border-red-400/30`	`bg-red-500 text-white`
Öffnungsstatus-Pille (unbekannt)	`bg-neutral-700/40`	`bg-neutral-700`
Badges (Küche/Webseite)	`bg-yumder-pink/90 · bg-yumder-teal/90`	`bg-yumder-pink · bg-yumder-teal`
Detail-Overlay · Schließen	`bg-black/60 border-white/20`	`bg-black`
Detail-Overlay · Öffnungsstatus	`bg-yumder-teal/10 border-yumder-teal/40`	`bg-yumder-teal text-neutral-900`
Joker-Button (deaktiviert)	`bg-neutral-800/70`	`bg-neutral-800`
Active-Filters-Container	`bg-neutral-800/40`	`bg-neutral-800`
Session-Info-Sheet · Zeile	`bg-neutral-800/40 · hover /60`	`bg-neutral-800 · hover /700`
Session-Info-Sheet · Code-Pille	`bg-neutral-900/50`	`bg-neutral-900`
Match-Overlay · Runner-up-Zeile	`bg-white/5 + backdrop-blur-sm`	`bg-neutral-800`

Hinweise

Bewusst transluzent bleiben (Scrim, kein Button): Overlay-Hintergründe bg-black/70 / bg-black/80 in Match-Overlay, Joker-Reveal, Tutorial, Session-Info-Sheet.
Betroffene Dateien: components/kokonutui/swipe-card-stack.tsx, app/session/[code]/session-client.tsx, components/active-filters.tsx, components/session-info-sheet.tsx, components/match-overlay.tsx.
Über die „Form" der Aktions-Buttons (Kreis vs. rounded-xl) und ob Variante A oder B gewünscht ist, bitte erst abstimmen.