Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(ui): gap at top of page in tablet mode #8885

Merged
merged 1 commit into from
May 19, 2023
Merged

Conversation

LeoMcA
Copy link
Member

@LeoMcA LeoMcA commented May 18, 2023

Summary

Problem

Header jumps around when opening the menu in tablet mode, exposing a 1px gap at the top of the page.

Icons in the article actions menu also appear cropped, due to half-pixel offset.

Solution

Make header and article actions band full-pixel heights, rather than half pixel.


Screenshots

Before

Observe the whole page seem to shift down 1px, including the header (look at the logo), and a gap at the top you can see some text peeking through, when the menu opens. Also observe the icons in article actions be cropped at the bottom when the menu opens:

Screencast.from.2023-05-18.11-11-11.webm

After

Screencast.from.2023-05-18.11-13-37.webm

due to a non-integer pixel height, also fixes cropped icons in article
actions menu for the same reason
@LeoMcA LeoMcA requested a review from caugner May 18, 2023 10:15
@caugner caugner merged commit dd98b12 into main May 19, 2023
@caugner caugner deleted the fix-half-pixel-header branch May 19, 2023 08:20
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.

2 participants