KrustyPlanet/hermes-agent
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(desktop): cap overlay inner-page width at 75rem

Browse source 
Add a shared PAGE_MAX_W (1200px) and center OverlayMain within its pane
so settings and command center bodies stay readable instead of sprawling
on wide/ultrawide displays.
This commit is contained in:
Brooklyn Nicholson 2026-07-02 20:39:10 -05:00 • committed by brooklyn!
parent 89acc19606
commit 66c3d595d1
2 changed files with 9 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

6
apps/desktop/src/app/layout-constants.ts
View file

@ -12,6 +12,12 @@ export const PAGE_INSET_X = 'px-[clamp(1.25rem,4vw,4rem)]'
// out to the gutter edges before re-applying PAGE_INSET_X.
export const PAGE_INSET_NEG_X = '-mx-[clamp(1.25rem,4vw,4rem)]'
// Readable cap for overlay "inner page" bodies (settings, command center). Wide
// enough to breathe, tight enough that content doesn't sprawl on ultrawide
// displays. Pair with `mx-auto w-full` to center within the pane. Literal string
// for Tailwind's scanner (see PAGE_INSET_X note).
export const PAGE_MAX_W = 'max-w-[75rem]'
// Below this viewport width a docked sidebar leaves no room for content, so both
// rails auto-collapse into the hover-reveal overlay. Single source of truth for
// the responsive collapse point.

5
apps/desktop/src/app/overlays/overlay-split-layout.tsx
View file

@ -3,7 +3,7 @@ import type { ReactNode } from 'react'
import type { IconComponent } from '@/lib/icons'
import { cn } from '@/lib/utils'
import { PAGE_INSET_X } from '../layout-constants'
import { PAGE_INSET_X, PAGE_MAX_W } from '../layout-constants'
interface OverlaySplitLayoutProps {
children: ReactNode
@ -64,7 +64,8 @@ export function OverlayMain({ children, className }: OverlayMainProps) {
return (
<main
className={cn(
'flex min-h-0 flex-1 flex-col overflow-hidden bg-transparent pb-3 pt-[calc(var(--titlebar-height)/2+1rem)]',
'mx-auto flex min-h-0 w-full flex-1 flex-col overflow-hidden bg-transparent pb-3 pt-[calc(var(--titlebar-height)/2+1rem)]',
PAGE_MAX_W,
PAGE_INSET_X,
className
)}