legop3/MultiRoombaRover
1
0
Fork 0
mirror of https://github.com/legop3/MultiRoombaRover.git synced 2026-11-15 03:02:17 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

big boy webui new new new new new 100 files changed 80 years

Browse Source
This commit is contained in:
legop3
2026-08-18 22:01:25 -04:00
parent 0f0f82e5f6
commit 737760ff56
79 changed files with 2714 additions and 388 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webui/src/components/vip/VipAudioUploadCard/VipAudioUploadCardContent.jsx
+9 -3
View File
@@ -539,7 +539,8 @@ export default function VipAudioUploadCard({
</div>
</section>
<div className="grid gap-0.5 grid-cols-1 lg:grid-cols-2">
{/* PTT controls split only when the Audio Controls card itself is wide. */}
<div className="grid grid-cols-1 gap-0.5 @[28rem]:grid-cols-2">
<section className="surface h-full">
<div className="grid h-full gap-0.5 grid-rows-[auto_auto_1fr]">
<p className="text-sm text-slate-200 text-center">PTT Mode</p>
@@ -578,7 +579,9 @@ export default function VipAudioUploadCard({
</section>
</div>
<div className="grid gap-0.5 grid-cols-1 lg:grid-cols-2">
{/* Upload and live-microphone controls stack in narrow sidebars instead
of inheriting the desktop viewport's two-column decision. */}
<div className="grid grid-cols-1 gap-0.5 @[28rem]:grid-cols-2">
<section className="surface h-full">
<div className="grid h-full gap-0.5 grid-rows-[auto_auto_1fr_auto]">
<p className="text-sm text-slate-200 text-center">Audio Upload</p>
@@ -642,7 +645,10 @@ export default function VipAudioUploadCard({
<section className="surface">
<div className="space-y-0.5">
<p className="text-sm text-slate-200 text-center">Audio Status</p>
<div className="grid gap-0.5 grid-cols-1 sm:grid-cols-2 lg:grid-cols-6">
{/* A compact sidebar gets two readable status columns. At 28rem the six
short status values fit again, restoring the card's normal strip in
old desktop and sufficiently wide mobile surfaces. */}
<div className="grid grid-cols-1 gap-0.5 @xs:grid-cols-2 @[28rem]:grid-cols-6">
<StatusIndicator label="Forward pipe" active={pipelineConnected} detail={pipelineConnected ? 'connected' : 'offline'} />
<StatusIndicator label="Upload playback" active={uploadPlaying} detail={uploadPlaying ? 'playing' : 'idle'} />
<StatusIndicator label="Mic relay" active={micRelayActive} detail={micRelayActive ? 'active' : 'idle'} />
webui/src/components/vip/VipMidiBeeperCard/index.jsx
+7 -3
View File
@@ -410,7 +410,9 @@ export default function VipMidiBeeperCard() {
return (
<CardFrame title="Midi Beeper">
<div className="grid gap-1">
<div className="grid gap-0.5 grid-cols-1 lg:grid-cols-2">
{/* The file and live-input workspaces follow this card's width. A wide
viewport must not force them beside each other inside a sidebar. */}
<div className="grid grid-cols-1 gap-0.5 @[28rem]:grid-cols-2">
<section className="surface h-full">
<div className="grid h-full gap-0.5 content-start">
<p className="text-sm text-slate-200 text-center">File playback</p>
@@ -495,7 +497,7 @@ export default function VipMidiBeeperCard() {
<div className="mx-auto grid w-full max-w-sm gap-0.5 text-xs text-slate-300 text-center">
<span>Playback shape</span>
<div className="grid grid-cols-2 gap-0.5 sm:grid-cols-4">
<div className="grid grid-cols-2 gap-0.5 @sm:grid-cols-4">
<label className="grid gap-0.5">
<span>Max note</span>
<input
@@ -647,7 +649,9 @@ export default function VipMidiBeeperCard() {
<section className="surface">
<div className="space-y-0.5">
<p className="text-sm text-slate-200 text-center">Beeper status</p>
<div className="grid gap-0.5 grid-cols-1 sm:grid-cols-2 lg:grid-cols-6">
{/* Status stays legible as a short vertical list in slim cards, then
returns to the normal six-value strip as soon as 28rem is available. */}
<div className="grid grid-cols-1 gap-0.5 @xs:grid-cols-2 @[28rem]:grid-cols-6">
<StatusRow label="Rover" value={ownRoverId || 'none'} active={Boolean(ownRoverId)} />
<StatusRow label="File state" value={playbackState} active={playbackState === 'playing'} />
<StatusRow label="Parts" value={selectedPartIds.length || 'none'} active={selectedPartIds.length > 0} />