Decrease top menu padding for high zoom / narrow screen #16044
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.
References
PR #15855.
This is the first of a series of PRs breaking up #15855 into individual CSS changes, with the hope that this will make it easier to tackle the issues that we've been having with Playwright Galata snapshot testing.
Code changes
Updates the padding rule for the
.lm-MenuBar-item
CSS selector so that menu bar items will all fit within narrow or zoomed-in screens.User-facing changes
See above.
Backwards-incompatible changes
n/a
How to test
Load JupyterLab. Drag window wide, drag window narrow. Observe how it affects padding in the menu bar. At 480px, padding should start to decrease. At 320px, the top menu bar items (File, Edit, View, Run, Kernel, Tabs, Settings, Help) will be scrunched together but should all be visible, as the following screenshot shows:
Alternatively, set your browser window to 1280px, then zoom in to 400%. Again, the menu items will be tightly spaced but should fit within the width of your browser window.