osobh/clawmates
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Computer header: divider between size toggles and Close

Browse Source 
The device-size cluster's divider was to the LEFT of the whole group; move it
between the phone toggle and the Close X (matches WorkClaw): [monitor][tablet]
[phone] │ [X].

Co-Authored-By: Claude Opus 4.8 <[email protected]>
This commit is contained in:
Omar Sobh
2026-06-12 22:53:44 -05:00
co-authored by Claude Opus 4.8
parent 704541f846
commit 5d2ed9395a
1 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/chat/ChatHeader.tsx
+3 -1
View File
@@ -100,13 +100,15 @@ export function ChatHeader({ onNewSession }: { onNewSession: () => void }) {
panel. */} panel. */}
{panelOpen && ( {panelOpen && (
<div className="absolute top-1/2 right-5 z-50 flex -translate-y-1/2 items-center gap-1"> <div className="absolute top-1/2 right-5 z-50 flex -translate-y-1/2 items-center gap-1">
<span aria-hidden className="mx-1 hidden h-5 w-px bg-border md:block" />
<div className="hidden md:flex"> <div className="hidden md:flex">
<DeviceSizeToggle <DeviceSizeToggle
value={device} value={device}
onChange={(size) => setParams({ device: size })} onChange={(size) => setParams({ device: size })}
/> />
</div> </div>
{/* Divider sits between the size toggles and Close (like the
reference), not to the left of the whole cluster. */}
<span aria-hidden className="mx-1 hidden h-5 w-px bg-border md:block" />
<button <button
type="button" type="button"
aria-label="Close computer" aria-label="Close computer"