betterer button

This commit is contained in:
legop3
2026-01-28 14:25:33 -05:00
parent ccf0eeb1aa
commit 77b5484381
5 changed files with 10 additions and 12 deletions
+6 -8
View File
@@ -37,12 +37,10 @@ export default function NightVisionControl({
const buttonClasses = useMemo(() => {
const base =
'group flex w-full items-center justify-between rounded-md border px-1 py-0.75 text-xs font-semibold uppercase tracking-wide';
const active =
'border-emerald-400/80 bg-emerald-600/30 text-emerald-50 shadow-[0_0_12px_rgba(16,185,129,0.45)]';
const inactive =
'border-amber-300/80 bg-amber-500/30 text-amber-50 shadow-[0_0_10px_rgba(251,191,36,0.35)]';
return [base, displayOn ? active : inactive, 'transition hover:brightness-110 disabled:opacity-50', className]
'group flex w-full items-center justify-between rounded border-2 px-1 py-0.75 text-xs font-semibold';
const active = 'border-emerald-300/70 bg-emerald-800 text-emerald-50 hover:bg-emerald-700';
const inactive = 'border-amber-300/70 bg-amber-900 text-amber-50 hover:bg-amber-800';
return [base, displayOn ? active : inactive, 'transition disabled:opacity-50', className]
.filter(Boolean)
.join(' ');
}, [className, displayOn]);
@@ -55,8 +53,8 @@ export default function NightVisionControl({
aria-pressed={displayOn}
className={buttonClasses}
>
<span className="flex items-center gap-1">
<span className="inline-flex h-2 w-2 rounded-full bg-current opacity-90" />
<span className="flex items-center gap-0.5">
<span className="inline-flex h-1.5 w-1.5 rounded-full bg-current opacity-90" />
<span>Night Vision</span>
</span>
<span className="flex items-center gap-1">