legop3/MultiRoombaRover
1
0
Fork 0
mirror of https://github.com/legop3/MultiRoombaRover.git synced 2026-09-15 17:12:59 -04:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

better button

Browse Source
This commit is contained in:
legop3
2026-01-28 14:22:29 -05:00
parent d87ec55802
commit ccf0eeb1aa
5 changed files with 20 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/public/assets/index-CTaVJhzk.css
-1
View File
File diff suppressed because one or more lines are too long
server/public/assets/index-RTgSmBnh.js → server/public/assets/index-DoJLt5SV.js
+1 -1
View File
File diff suppressed because one or more lines are too long
server/public/assets/index-McaB0rzU.css
+1
View File
File diff suppressed because one or more lines are too long
server/public/index.html
+2 -2
View File
@@ -11,8 +11,8 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="Multi Roomba Rover" />
<title>Multi Roomba Rover</title>
<script type="module" crossorigin src="/assets/index-RTgSmBnh.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-CTaVJhzk.css">
<script type="module" crossorigin src="/assets/index-DoJLt5SV.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-McaB0rzU.css">
</head>
<body>
<div id="root"></div>
webui/src/components/NightVisionControl.jsx
+16 -13
View File
@@ -25,7 +25,7 @@ export default function NightVisionControl({
const displayOn = hasState ? optimistic : false;
const statusLabel = hasState ? (displayOn ? 'On' : 'Off') : '—';
const statusClasses = displayOn
? 'bg-emerald-600 text-emerald-50'
? 'bg-emerald-500 text-emerald-950'
: 'bg-slate-700 text-slate-200';
const handleToggle = () => {
@@ -35,17 +35,17 @@ export default function NightVisionControl({
onToggle?.(next);
};
const buttonClasses = useMemo(
() =>
[
'flex w-full items-center justify-between rounded bg-zinc-950 px-1 py-0.5 text-xs text-slate-300',
'transition hover:bg-zinc-900 disabled:opacity-50',
className,
]
.filter(Boolean)
.join(' '),
[className],
);
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]
.filter(Boolean)
.join(' ');
}, [className, displayOn]);
return (
<button
@@ -55,7 +55,10 @@ export default function NightVisionControl({
aria-pressed={displayOn}
className={buttonClasses}
>
<span className="text-slate-400">Night Vision</span>
<span className="flex items-center gap-1">
<span className="inline-flex h-2 w-2 rounded-full bg-current opacity-90" />
<span>Night Vision</span>
</span>
<span className="flex items-center gap-1">
<span className={`rounded px-1 py-0.5 text-[0.65rem] font-semibold ${statusClasses}`}>
{statusLabel}