Skip to content

Center the conversation and fix Replies and drawer spacing - #1112

Merged
TheGreatAxios merged 10 commits into
corbitsdev:mainfrom
pratikbuilds:cl-1109-centered-conversation
Oct 9, 2026
Merged

TheGreatAxios merged 10 commits into
corbitsdev:mainfrom
pratikbuilds:cl-1109-centered-conversation

Conversation

@pratikbuilds

@pratikbuilds pratikbuilds commented Oct 6, 2026 •

Copy link
Copy Markdown
Collaborator

Summary

The conversation, day divider, and input share a centered column capped at 1200px when side panels are closed. Opening Replies, the bench drawer, or both keeps the input 16px from the nearest panel. User bubbles retain their 16px inset. The desktop drawer is a flat side panel with one divider, avoiding a nested card surface.

- Uneven conversation/input widths and large gaps beside side panels
+ Centered conversation, with a 16px input gap beside an open panel
- Floating drawer card nested inside the main sheet
+ Flat details panel with one divider

Fixes #1109.

Evidence

Conversation alignment — the timeline, divider, and input now share one centered column. Before is the original issue screenshot; after is the current local preview.

BeforeAfter
Before: left-aligned conversation and wider input After: centered conversation and input with matching edges

Replies spacing — the large empty gap beside Replies is replaced by a 16px input inset. User bubbles keep their inset. These close-ups show the reported gap and the final layout; full after screenshot.

BeforeAfter
Before: large gap between the conversation input and Replies divider After: input and user bubbles inset from the Replies divider

Details drawer — the input gap drops from 81.5px to 16px. The nested rounded card becomes a flat panel with one continuous divider. Both screenshots use the same conversation and 2048px viewport.

BeforeAfter
Before: oversized input gap and floating details card After: 16px input gap and flat details panel with visible divider
  • Before: the Replies regression reproduces a 127px gap at 2048px; the details-only live preview measures an 81.5px gap. The drawer regression fails because its floating card is inset rather than flush with its column.
    After: bun test e2e/browser/zero-to-one.test.ts passes against a disposable Postgres database: 1 test, 466 assertions. Covers 390–2048px widths, 860/861px phone boundary, drawer and Replies toggles, both panels open, 16px/20px reserved scrollbar space, scrolling, prose width, and overflow. Mocked worker reply, follow-up, artifact creation, routine brief, and rename persistence pass; browser errors are empty.
  • Live preview verifies the details-only input gap at 16px, a 1px drawer divider, and no nested card shadow or rounded edge.
  • bun run build, typecheck, lint, formatting, and git diff --check pass.
  • bun run check still fails on two existing packages with bun test scripts and no test files: @corbits/url-path and @corbits/workflows. DB-backed suites were checked separately with the browser command above; the root check ran without DATABASE_URL.

The merge resolution keeps main’s deletion of the standalone worker-reply suite and moves this PR’s layout checks into the consolidated zero-to-one flow. The CSS and design changes are unchanged.

Merge Danger

Door: two-way

CSS layout changes; no schema or runtime changes.

Blast Radius: layout

Conversation, input, side panel spacing, and bench drawer appearance. The phone drawer remains a full-width overlay.

@pratikbuilds pratikbuilds changed the title Center the workbench conversation and composer Center the conversation and fix Replies and drawer spacing Oct 7, 2026
@pratikbuilds
pratikbuilds marked this pull request as ready for review October 7, 2026 15:35

@TheGreatAxios TheGreatAxios left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is perfect -- aligning even better with the original mockups and spacing targets. LGTM

@pratikbuilds
pratikbuilds force-pushed the cl-1109-centered-conversation branch from 9553710 to f430e74 Compare October 9, 2026 10:56
@TheGreatAxios
TheGreatAxios merged commit ad77ae2 into corbitsdev:main Oct 9, 2026
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Align the workbench conversation and composer in a centered desktop column

2 participants