fix: gate toggle button overflow, white dot stays within bounds
This commit is contained in:
parent
f8f13a48d5
commit
06552c2b75
@ -143,9 +143,9 @@ function GateRow({
|
||||
<button
|
||||
type="button"
|
||||
onClick={onToggle}
|
||||
className={`relative w-10 h-5 rounded-full transition-colors ${enabled ? "bg-blue-500" : "bg-slate-300"}`}
|
||||
className={`relative inline-flex items-center w-10 h-5 rounded-full transition-colors flex-shrink-0 ${enabled ? "bg-blue-500" : "bg-slate-300"}`}
|
||||
>
|
||||
<span className={`absolute top-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform ${enabled ? "translate-x-5" : "translate-x-0.5"}`} />
|
||||
<span className={`absolute top-0.5 left-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform ${enabled ? "translate-x-5" : "translate-x-0"}`} />
|
||||
</button>
|
||||
</div>
|
||||
{enabled && <div className="mt-2">{children}</div>}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user