Unify hover effects via semantic theme tokens

Replace one-off hover colors with hover-neutral/hover-destructive tokens
so all interactive elements respond consistently to theme changes. Fix
hover-neutral-bg token value (was identical to card surface, making hover
invisible on card backgrounds) to a semi-transparent primary tint. Switch
turn nav buttons to outline variant for visible hover feedback. Convert HP
popover damage/heal to plain buttons to avoid ghost variant hover conflict
with tailwind-merge.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Lukas
2026-03-13 16:58:01 +01:00
parent bd39808000
commit f9ef64bb00
7 changed files with 202 additions and 17 deletions

View File

@@ -55,7 +55,7 @@ export function PlayerManagement({
<button
type="button"
onClick={onClose}
className="text-muted-foreground hover:text-foreground transition-colors"
className="text-muted-foreground hover:text-hover-neutral transition-colors"
>
<X size={20} />
</button>
@@ -78,7 +78,7 @@ export function PlayerManagement({
return (
<div
key={pc.id}
className="group flex items-center gap-3 rounded-md px-3 py-2 hover:bg-background/50"
className="group flex items-center gap-3 rounded-md px-3 py-2 hover:bg-hover-neutral-bg"
>
{Icon && (
<Icon size={18} style={{ color }} className="shrink-0" />
@@ -95,7 +95,7 @@ export function PlayerManagement({
<button
type="button"
onClick={() => onEdit(pc)}
className="text-muted-foreground hover:text-foreground transition-colors"
className="text-muted-foreground hover:text-hover-neutral transition-colors"
title="Edit"
>
<Pencil size={14} />