Fix: nested button in theme card
This commit is contained in:
@@ -174,11 +174,13 @@ interface ThemeCardProps {
|
|||||||
|
|
||||||
function ThemeCard({ name, author, preview, isActive, isDefault, isForceEnabled, disabled, variants, onActivate, onRemove }: ThemeCardProps) {
|
function ThemeCard({ name, author, preview, isActive, isDefault, isForceEnabled, disabled, variants, onActivate, onRemove }: ThemeCardProps) {
|
||||||
return (
|
return (
|
||||||
|
<div className="relative">
|
||||||
<button
|
<button
|
||||||
|
type="button"
|
||||||
onClick={onActivate}
|
onClick={onActivate}
|
||||||
disabled={disabled}
|
disabled={disabled}
|
||||||
className={cn(
|
className={cn(
|
||||||
'relative flex flex-col items-center p-3 rounded-xl border-2 transition-all text-left w-full disabled:cursor-not-allowed disabled:opacity-60',
|
'flex flex-col items-center p-3 rounded-xl border-2 transition-all text-left w-full disabled:cursor-not-allowed disabled:opacity-60',
|
||||||
isActive
|
isActive
|
||||||
? 'border-primary bg-primary/5 ring-1 ring-primary/20'
|
? 'border-primary bg-primary/5 ring-1 ring-primary/20'
|
||||||
: 'border-border hover:border-primary/40 bg-card',
|
: 'border-border hover:border-primary/40 bg-card',
|
||||||
@@ -221,17 +223,19 @@ function ThemeCard({ name, author, preview, isActive, isDefault, isForceEnabled,
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
</button>
|
||||||
|
|
||||||
{/* Remove button */}
|
{/* Remove button */}
|
||||||
{onRemove && !isActive && (
|
{onRemove && !isActive && (
|
||||||
<button
|
<button
|
||||||
onClick={(e) => { e.stopPropagation(); onRemove(); }}
|
type="button"
|
||||||
|
onClick={onRemove}
|
||||||
className="absolute top-2 right-2 p-1 rounded-md hover:bg-destructive/10 text-muted-foreground hover:text-destructive transition-colors"
|
className="absolute top-2 right-2 p-1 rounded-md hover:bg-destructive/10 text-muted-foreground hover:text-destructive transition-colors"
|
||||||
title="Remove theme"
|
title="Remove theme"
|
||||||
>
|
>
|
||||||
<Trash2 className="w-3.5 h-3.5" />
|
<Trash2 className="w-3.5 h-3.5" />
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
</button>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user