{{ message }}
Play: database panel hide button, full-width clickable rows, and width-jitter fix#108013
Merged
Conversation
…fix width jitter Several improvements to the database panel in the Web SQL UI (Play): - Add a `title` to the database viewer icon so a tooltip shows on hover. - Add a small faint "hide panel" button (an SVG `<-|` glyph) at the top-right corner of the menu, vertically aligned with the middle of the database icon, shown only while the panel is open; clicking it closes the panel. - Make the clickable area of database and table names span the full width of the panel, with a full-width hover highlight. The table size/rows/engine balloon now opens only when the cursor is over the name (not the empty space) and is anchored just to the right of the name. - Reserve the scrollbar gutter (`scrollbar-gutter: stable`) on the panel so the whole panel no longer widens by a few pixels when the vertical scrollbar appears (the menu column is auto-sized, so the scrollbar width was being added to it). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Contributor
clickhouse-gh
Bot
added
the
pr-improvement
![clickhouse-gh[bot]](https://avatars.githubusercontent.com/in/928874?s=60&v=4){kind=small}
The loading hourglass is absolutely positioned as a sibling overlaying the
right edge of the now full-width database `button`. Because it is not inside
the button, a click on that area failed `e.target.closest('button')` in the
`#menu` click handler and was treated as a menu background click, calling
`toggleDatabases` and closing the whole panel instead of acting on the row.
Add `pointer-events: none` to `.loading-hourglass` so clicks pass through to
the underlying full-width button and the row stays fully clickable while
tables are loading.
Addresses review feedback from `clickhouse-gh`.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
pamarcos
approved these changes
Jun 22, 2026
pamarcos
left a comment
pamarcos
left a comment
Member
There was a problem hiding this comment.
👌
I've tested all the changes and they work great. I haven't found anything that breaks it or behaves in unexpected ways.
robot-ch-test-poll3
added
the
pr-synced-to-cloud
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Several usability improvements to the database panel in the Web SQL UI (Play):
titleso a tooltip shows on hover.<-|"collapse left" glyph) at the top-right corner of the menu, vertically aligned with the middle of the database icon. It is shown only while the panel is open and closes the panel when clicked.scrollbar-gutter: stable), so the panel width no longer shifts.All changes are confined to
programs/server/play.html(frontend HTML/CSS/JS), so no build is required; they can be verified by loading/play.Changelog category (leave one):
Changelog entry (a user-readable short description of the changes that goes into CHANGELOG.md):
Improvements to the database panel in the Web SQL UI (Play): a tooltip on the database icon, a button to hide the panel, full-width clickable database/table names, and a fix for the panel width shifting when the scrollbar appears.
Documentation entry for user-facing changes
Version info
26.6.1.1129