From 7cd1bf5da8a6d220b4c17f089dc7860c52b18e35 Mon Sep 17 00:00:00 2001 From: laansdole Date: Mon, 16 Mar 2026 17:51:19 +0700 Subject: [PATCH] fix(frontend): make fullscreen chat panel scrollable --- frontend/src/pages/LaunchView.vue | 1 + .../changes/fix-fullscreen-chat-scroll/proposal.md | 12 ++++++++++++ .../specs/chat-panel/spec.md | 14 ++++++++++++++ .../changes/fix-fullscreen-chat-scroll/tasks.md | 7 +++++++ 4 files changed, 34 insertions(+) create mode 100644 openspec/changes/fix-fullscreen-chat-scroll/proposal.md create mode 100644 openspec/changes/fix-fullscreen-chat-scroll/specs/chat-panel/spec.md create mode 100644 openspec/changes/fix-fullscreen-chat-scroll/tasks.md diff --git a/frontend/src/pages/LaunchView.vue b/frontend/src/pages/LaunchView.vue index 4924ad25..497c39ee 100755 --- a/frontend/src/pages/LaunchView.vue +++ b/frontend/src/pages/LaunchView.vue @@ -2436,6 +2436,7 @@ watch( overflow: hidden; display: flex; flex-direction: column; + min-height: 0; } .chat-messages::-webkit-scrollbar { diff --git a/openspec/changes/fix-fullscreen-chat-scroll/proposal.md b/openspec/changes/fix-fullscreen-chat-scroll/proposal.md new file mode 100644 index 00000000..3fd82b04 --- /dev/null +++ b/openspec/changes/fix-fullscreen-chat-scroll/proposal.md @@ -0,0 +1,12 @@ +# Change: Fix Fullscreen Chat Panel Scrolling + +## Why +After the persistent chat panel refactoring (commits `5525813` and `d796015`), the fullscreen chat mode is no longer scrollable. When the chat panel is in fullscreen mode (`viewMode === 'chat'`), messages accumulate but users cannot scroll through them. + +## What Changes +- Fix CSS flexbox chain in `LaunchView.vue` so that `overflow-y: auto` on `.chat-messages` activates correctly in fullscreen mode +- Add `min-height: 0` to intermediate flex containers (`.chat-panel-content` and `.chat-box`) to allow them to shrink below their content size + +## Impact +- Affected specs: chat-panel (new capability spec) +- Affected code: `frontend/src/pages/LaunchView.vue` (CSS only, ~2–3 lines) diff --git a/openspec/changes/fix-fullscreen-chat-scroll/specs/chat-panel/spec.md b/openspec/changes/fix-fullscreen-chat-scroll/specs/chat-panel/spec.md new file mode 100644 index 00000000..881df983 --- /dev/null +++ b/openspec/changes/fix-fullscreen-chat-scroll/specs/chat-panel/spec.md @@ -0,0 +1,14 @@ +## ADDED Requirements + +### Requirement: Fullscreen Chat Scrolling +The chat messages area SHALL be scrollable when the chat panel is in fullscreen mode and messages exceed the visible viewport height. + +#### Scenario: Messages overflow in fullscreen chat +- **WHEN** the chat panel is in fullscreen mode (`viewMode === 'chat'`) +- **AND** the number of chat messages exceeds the visible area +- **THEN** the `.chat-messages` container SHALL allow vertical scrolling via `overflow-y: auto` + +#### Scenario: Scroll position preserved on new message +- **WHEN** the user is scrolled to the bottom of the chat +- **AND** a new message arrives +- **THEN** the chat SHALL auto-scroll to show the latest message diff --git a/openspec/changes/fix-fullscreen-chat-scroll/tasks.md b/openspec/changes/fix-fullscreen-chat-scroll/tasks.md new file mode 100644 index 00000000..e3c9691a --- /dev/null +++ b/openspec/changes/fix-fullscreen-chat-scroll/tasks.md @@ -0,0 +1,7 @@ +## 1. Implementation +- [x] 1.1 Add `min-height: 0` to `.chat-panel-content` in `LaunchView.vue` +- [x] 1.2 Add `min-height: 0` to `.chat-box` in `LaunchView.vue` + +## 2. Verification +- [x] 2.1 Run `openspec validate fix-fullscreen-chat-scroll --strict --no-interactive` +- [ ] 2.2 Manual visual test: open app, verify fullscreen chat scrolls when messages overflow