Skip to content

fix(console): fix canvas scrollbar gutter, scroll redraw, and mobile spacing - #7280

Closed
SandipGhimire wants to merge 1 commit into
pterodactyl:2.0-developfrom
SandipGhimire:terminal-ui-fix
Closed

SandipGhimire wants to merge 1 commit into
pterodactyl:2.0-developfrom
SandipGhimire:terminal-ui-fix

Conversation

@SandipGhimire

@SandipGhimire SandipGhimire commented Oct 11, 2026 •

Copy link
Copy Markdown

Issue

  • Extra blank line at the bottom: term.writeln() appended \r\n after every line and left the cursor visible on a trailing empty row, creating extra gap above the command input.
  • Overridden / clipped text when scrolling:
    • Ghostty's default measureFont() only measured "M", whose near-zero descent caused descenders (g, j, p, q, y, [, ]) to bleed across rows and not clear cleanly during scroll redraws.
    • Empty/null scrollback rows were skipped during redraws instead of clearing their row background, leaving stale text behind.
    • Terminal.resize() in ghostty-web overwrote canvas.width without devicePixelRatio scaling, and FitAddon's 50ms _isResizing lock dropped immediate post-layout and mobile ResizeObserver re-fits.
  • Mobile layout & resize overflow: Negative mobile margins (-ml-4 w-[calc(100%+2rem)]) pushed the console outside the page container past the power buttons, and missing min-w-0 / overflow-hidden prevented the flex wrapper from shrinking when resizing down to mobile.

Solution

  • Eliminate trailing blank row: Prefix \r\n before subsequent writeln calls instead of after the last line, hide the read-only canvas cursor (cursorVisible = false), and remove bottom container padding when the command input is visible.
  • Clean scroll & resize rendering:
    • Measure full glyph ascent and descent (measureTerminalFont) so rows never clip or overlap descenders.
    • Return [] instead of null from getLine / getScrollbackLine, clamp viewportY to [0, maxScrollback], and clear the canvas background whenever the whole-line viewport shifts.
    • Unlock FitAddon's _isResizing guard (unlockFitResize) and preserve HiDPI canvas sizing in term.resize().
  • Fix mobile alignment: Use w-full, min-w-0, and overflow-hidden on the console containers in Console.tsx so the terminal and ConsoleScrollbar align and resize properly on mobile viewports.

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.

1 participant