diff --git a/opencode.md b/opencode.md index 8582fc8..97a14bf 100644 --- a/opencode.md +++ b/opencode.md @@ -228,10 +228,11 @@ list reordering, not free placement. Don't confuse the two. the panel), a `resize` effect re-clamps on browser resize, and `.win-window.centered` carries `max-width`/`max-height`. Keep these in sync if you add a new window path, or windows will escape the viewport. The bottom - limit is `TASKBAR_HEIGHT = 64` in `WindowsDesktop.tsx` (panel `bottom:10px` + - `height:44px` = 54, plus a 10px gap), so a dragged window stops just above the - taskbar; note `useDesktopIcons.ts` has its **own** `TASKBAR_HEIGHT = 48` for - the icon grid. + limit is `TASKBAR_HEIGHT = 59` in `WindowsDesktop.tsx` (panel top at 54px + a + 5px gap), so dragged and maximized windows stop 5px above the taskbar. That + `59` is duplicated in `skeuo.css` (`.win-window.maximized` height, + `.win-window.centered` bottom / max-height) — keep them in sync. Note + `useDesktopIcons.ts` has its **own** `TASKBAR_HEIGHT = 48` for the icon grid. - Exposing the **dev** server over a tunnel needs the tunnel host in `allowedDevOrigins` (`next.config.ts`). Without it Next dev rejects the cross-origin HMR WebSocket, so the client never hydrates — the page is SSR diff --git a/src/app/components/WindowsDesktop.tsx b/src/app/components/WindowsDesktop.tsx index 573c2e1..db82b06 100644 --- a/src/app/components/WindowsDesktop.tsx +++ b/src/app/components/WindowsDesktop.tsx @@ -10,10 +10,9 @@ import { useDesktopIcons } from "./useDesktopIcons"; import { WALLPAPER, friends } from "../data"; // The panel sits at `bottom: 10px` with a height of 44px, so its top edge is -// 54px above the viewport bottom. Windows clamp 10px above that, so a dragged -// window stops just above the taskbar with a small gap instead of touching or -// overlapping it. -const TASKBAR_HEIGHT = 64; +// 54px above the viewport bottom. Windows clamp 5px above that (59), so a +// dragged or maximized window stops just above the taskbar. +const TASKBAR_HEIGHT = 59; const LEFT_APPS = APPS.filter((a) => a.id !== "services" && a.id !== "friends"); diff --git a/src/app/skeuo.css b/src/app/skeuo.css index 89a2a00..02bba0f 100644 --- a/src/app/skeuo.css +++ b/src/app/skeuo.css @@ -307,17 +307,18 @@ a.win-icon { } .win-window.maximized { border-radius: 0; - height: calc(100% - 54px) !important; + /* 54px panel top + 5px gap, so maximized windows also stop above the panel. */ + height: calc(100% - 59px) !important; } .win-window.centered { left: 0; right: 0; top: 0; - bottom: 54px; + bottom: 59px; margin: auto; /* Never let a centred window (e.g. Welcome) overflow a small viewport. */ max-width: calc(100vw - 20px); - max-height: calc(100vh - 74px); + max-height: calc(100vh - 79px); } /* On very short viewports the default min-height would win over max-height and push the window off-screen; let it shrink further so it still fits. */