Nicholai/bandit-runner
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Inconsistent/changing panel sizes #1

New Issue
Closed
opened 2025-10-10 01:43:12 +00:00 by Nicholai · 1 comment
Nicholai commented 2025-10-10 01:43:12 +00:00
Owner
Copy Link
name about labels
🐞 Bug report Report a reproducible problem
type:fix

What happened?

As the panels fill up with output from the agent and terminal, both panels both grow in height until they extend past the page, rendering them unviewable.

Expected behavior

The chat panels should maintain consistent sizing, once context grows beyond the height of the chat panels they should autoscroll by default with a manual scrolling override if the user wishes to see chat history.

Repro steps

  1. Open the page in a browser in 16:9 aspect ratio
  2. Select any LLM capable of making it to step one and press start
  3. watch as the output grows each panel until they extend off screen, breaking the UI and functionality.

Logs / screenshots

  • Size before start: image.png
  • Size after start: image.png

Environment

  • Browser: Occurs in both Firefox and Chrome, both on latest updates as of 10-9-2025
  • Occurs on the production cloudflare worker
  • Commit ID: 9881c450b6
--- name: "🐞 Bug report" about: Report a reproducible problem labels: ["type:fix"] --- ### What happened? As the panels fill up with output from the agent and terminal, both panels both grow in height until they extend past the page, rendering them unviewable. ### Expected behavior The chat panels should maintain consistent sizing, once context grows beyond the height of the chat panels they should autoscroll by default with a manual scrolling override if the user wishes to see chat history. ### Repro steps 1. Open the page in a browser in 16:9 aspect ratio 2. Select any LLM capable of making it to step one and press `start` 3. watch as the output grows each panel until they extend off screen, breaking the UI and functionality. ### Logs / screenshots - **Size before start:** ![image.png](/attachments/5bd7679b-91fd-4d7e-ab56-4e7b0c4f7844) - **Size after start:** ![image.png](/attachments/da0b3a45-490b-4e42-bc76-e5df72b6e3ca) ### Environment - Browser: Occurs in both Firefox and Chrome, both on latest updates as of 10-9-2025 - Occurs on the production [cloudflare worker](https://bandit-runner-app.nicholaivogelfilms.workers.dev/) - Commit ID: `9881c450b6`
image.png
172 KiB
image.png
53 KiB
Nicholai commented 2025-10-10 02:07:39 +00:00
Author
Owner
Copy Link

Fixed ✅

Root Cause:
The panels were using h-auto on large screens, causing them to expand infinitely with content instead of maintaining fixed heights with internal scrolling.

Solution:
Implemented proper flexbox constraints following shadcn/ui best practices:

  • Added overflow-hidden to parent grid container
  • Replaced h-[55vh] lg:h-auto and h-[40vh] lg:h-auto with min-h-0 on panel containers
  • Changed ScrollArea from h-full to min-h-0 for proper flex behavior

Result:

  • Panels now maintain consistent sizing across all viewports
  • Internal scrolling works correctly
  • Content no longer extends off-screen

Testing:
Verified on production with multiple content scenarios. Panels properly constrain and scroll internally.

Deployed to production:

## Fixed ✅ **Root Cause:** The panels were using `h-auto` on large screens, causing them to expand infinitely with content instead of maintaining fixed heights with internal scrolling. **Solution:** Implemented proper flexbox constraints following shadcn/ui best practices: - Added `overflow-hidden` to parent grid container - Replaced `h-[55vh] lg:h-auto` and `h-[40vh] lg:h-auto` with `min-h-0` on panel containers - Changed ScrollArea from `h-full` to `min-h-0` for proper flex behavior **Result:** - Panels now maintain consistent sizing across all viewports - Internal scrolling works correctly - Content no longer extends off-screen **Testing:** Verified on production with multiple content scenarios. Panels properly constrain and scroll internally. **Deployed to production:** - Version: af967663-0d09-4168-b1e5-d9b6fc2d441c - URL: https://bandit-runner-app.nicholaivogelfilms.workers.dev/
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
area:infra
infra and deploy
area:runner
run coordination
area:tooling
dev tooling
area:ui
frontend UI
prio:high
high priority
prio:low
low priority
prio:med
medium priority
status:blocked
blocked
status:in-progress
in progress
status:ready
ready to pick up
type:chore
internal chore
type:docs
documentation
type:feat
new feature
type:fix
bug fix
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
Nicholai
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Nicholai/bandit-runner#1
No description provided.
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?