Files
headquarter/openspec/changes/fix-terminal-container-overflow/tasks.md
T
Developer ac9f7a9299 fix: prevent terminal container from overflowing page on desktop
The desktop terminal page sometimes grew an outer scrollbar because the
terminal instance/wrapper/container chain lacked height constraints.
Without min/max-height enforcement, xterm.js's internal viewport could
expand its parent flex/grid track past the available space.

- Add overflow: hidden to .terminal-page.
- Add max-height: 100% and overflow: hidden to .terminal-instance.
- Add max-height: 100% to .terminal-wrapper.
- Add min-height: 0 to .terminal-container.
- Constrain .xterm-viewport to max-height/width 100% so it fills but
  never exceeds its container.

Quality gates: npm run typecheck, npm run lint, npm test -- --run (87 passed).

Refs: openspec/changes/fix-terminal-container-overflow
2026-06-14 09:07:43 +00:00

816 B

Fix Terminal Container Overflow on Desktop — Tasks

  • Discard debug terminal.tsx changes from debug/mobile-terminal-scroll.
  • Create focused branch fix/terminal-container-overflow from dev.
  • Update utilities.css to prevent terminal container from overflowing its flex/grid track:
    • .terminal-page: add overflow: hidden.
    • .terminal-instance: add max-height: 100% and overflow: hidden.
    • .terminal-wrapper: add max-height: 100%.
    • .terminal-container: add min-height: 0.
    • .terminal-container .xterm-viewport: add max-height: 100% !important and width: 100% !important.
  • Run npm run typecheck and npm run lint in apps/web.
  • Run npm test -- --run in apps/web (87 passed).
  • Update project maps for changed files.