diff --git a/apps/web/src/components/combatant-row.tsx b/apps/web/src/components/combatant-row.tsx index 8974868..7bd460b 100644 --- a/apps/web/src/components/combatant-row.tsx +++ b/apps/web/src/components/combatant-row.tsx @@ -598,7 +598,7 @@ export function CombatantRow({ icon={} label="Remove combatant" onConfirm={() => onRemove(id)} - className="h-7 w-7 text-muted-foreground opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto focus:opacity-100 focus:pointer-events-auto transition-opacity" + className="h-7 w-7 text-muted-foreground opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto focus:opacity-100 focus:pointer-events-auto pointer-coarse:opacity-100 pointer-coarse:pointer-events-auto transition-opacity" /> diff --git a/apps/web/src/components/condition-tags.tsx b/apps/web/src/components/condition-tags.tsx index 29db056..2ebf810 100644 --- a/apps/web/src/components/condition-tags.tsx +++ b/apps/web/src/components/condition-tags.tsx @@ -89,7 +89,7 @@ export function ConditionTags({ type="button" title="Add condition" aria-label="Add condition" - className="inline-flex items-center rounded p-0.5 text-muted-foreground hover:text-hover-neutral hover:bg-hover-neutral-bg transition-colors opacity-0 group-hover:opacity-100 focus:opacity-100 transition-opacity" + className="inline-flex items-center rounded p-0.5 text-muted-foreground hover:text-hover-neutral hover:bg-hover-neutral-bg transition-colors opacity-0 group-hover:opacity-100 focus:opacity-100 pointer-coarse:opacity-100 transition-opacity" onClick={(e) => { e.stopPropagation(); onOpenPicker(); diff --git a/apps/web/src/index.css b/apps/web/src/index.css index 850bbef..e2a5439 100644 --- a/apps/web/src/index.css +++ b/apps/web/src/index.css @@ -80,6 +80,8 @@ } } +@custom-variant pointer-coarse (@media (pointer: coarse)); + @utility animate-confirm-pulse { animation: confirm-pulse 300ms ease-out; }