Layout Max-Width for MacBook screens #4

New Issue

tonym · 2026-01-15T01:20:16Z

tonym commented

2026-01-15 01:20:16 +00:00

Problem

UI feels too spread out on MacBook screens. Content expands to full width without constraints, making it hard to scan.

Solution

Add max-width constraint to content area.

Modify `client/src/components/layout.tsx`:

<div style={{ maxWidth: 1400, margin: "0 auto", padding: "0 16px" }}>
  {children}
</div>

Modify `client/src/utils/overrides.css`:

.ant-form { max-width: 800px; }

Priority

Low - simple CSS change

## Problem UI feels too spread out on MacBook screens. Content expands to full width without constraints, making it hard to scan. ## Solution Add max-width constraint to content area. ### Modify `client/src/components/layout.tsx`: ```tsx <div style={{ maxWidth: 1400, margin: "0 auto", padding: "0 16px" }}> {children} </div> ``` ### Modify `client/src/utils/overrides.css`: ```css .ant-form { max-width: 800px; } ``` ## Priority Low - simple CSS change

tonym referenced this issue from a commit

2026-01-15 01:58:16 +00:00

docs: Update CLAUDE.md with Issue #3 completion

tonym referenced this issue from a commit

2026-01-15 01:59:39 +00:00

feat: Add layout max-width for better UX on wide screens (#4)

tonym referenced this issue from a commit

2026-01-15 02:00:02 +00:00

docs: Update CLAUDE.md with Issue #4 completion

tonym closed this issue

2026-01-16 03:41:13 +00:00

Sign in to join this conversation.