The frameless macOS desktop window relies on -webkit-app-region: drag to mark native title-bar regions (window drag + double-click-to-zoom). Only the sidebar header was draggable, so double-clicking the top of the main content area did nothing. Reserve a title-bar-height strip along the top of <main> and mark it draggable, mirroring the sidebar header. It is hidden off-desktop and reserves space rather than overlaying, so it never swallows clicks on page content beneath it.
Unified · Split
| @@ -545,6 +545,11 @@ export function Shell() { · 544 unmodified lines | |||
| 545 | 545 | ||
| 546 | {/* Main content */} | 546 | {/* Main content */} |
| 547 | <main className="flex min-h-0 flex-1 flex-col min-w-0 overflow-hidden"> | 547 | <main className="flex min-h-0 flex-1 flex-col min-w-0 overflow-hidden"> |
| 548 | {/* Desktop (macOS frameless) draggable title-bar strip. Gives the main | ||
| 549 | area the same native window drag + double-click-to-zoom as the | ||
| 550 | sidebar header; hidden everywhere else via CSS. */} | ||
| 551 | <div className="desktop-macos-main-titlebar" /> | ||
| 552 | |||
| 548 | {/* Mobile top bar */} | 553 | {/* Mobile top bar */} |
| 549 | <div className="flex h-12 shrink-0 items-center justify-between border-b border-border bg-background px-4 md:hidden"> | 554 | <div className="flex h-12 shrink-0 items-center justify-between border-b border-border bg-background px-4 md:hidden"> |
| 550 | <Button | 555 | <Button |
| @@ -164,6 +164,27 @@ · 163 unmodified lines | |||
| 164 | -webkit-app-region: no-drag; | 164 | -webkit-app-region: no-drag; |
| 165 | } | 165 | } |
| 166 | 166 | ||
| 167 | /* The main content area sits to the right of the sidebar. On the frameless | ||
| 168 | desktop window it renders page content straight to the top edge with nothing | ||
| 169 | marked as a drag region, so the window could not be moved or | ||
| 170 | double-clicked-to-zoom from there (only the sidebar header worked, see | ||
| 171 | .desktop-macos-titlebar above). Reserve a title-bar-height strip along the | ||
| 172 | top of the main area and make it draggable so the whole top row behaves like | ||
| 173 | the native title bar. Hidden off-desktop. It reserves space rather than | ||
| 174 | overlaying, so no page content sits under the drag region (a drag region | ||
| 175 | would otherwise swallow clicks on anything beneath it). The traffic lights | ||
| 176 | sit over the sidebar, never the main area, so no left offset is needed here. */ | ||
| 177 | .desktop-macos-main-titlebar { | ||
| 178 | display: none; | ||
| 179 | } | ||
| 180 | |||
| 181 | .executor-desktop-macos .desktop-macos-main-titlebar { | ||
| 182 | display: block; | ||
| 183 | height: 3rem; /* matches the sidebar header (h-12) */ | ||
| 184 | flex-shrink: 0; | ||
| 185 | -webkit-app-region: drag; | ||
| 186 | } | ||
| 187 | |||
| 167 | /* The 88px title-bar offset eats into the sidebar's width; without extra room | 188 | /* The 88px title-bar offset eats into the sidebar's width; without extra room |
| 168 | the brand wordmark and the server-connection menu collide. Widen the macOS | 189 | the brand wordmark and the server-connection menu collide. Widen the macOS |
| 169 | sidebar so both clear the traffic lights with comfortable spacing. */ | 190 | sidebar so both clear the traffic lights with comfortable spacing. */ |