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 layout shift in list page #2349

Merged
merged 3 commits into from
Jun 27, 2024

Conversation

zahraaalizadeh
Copy link
Collaborator

@zahraaalizadeh zahraaalizadeh commented Jun 26, 2024

issue: #1013

This change:

  • declares the height of search box to avoid layout shift
  • declares the size of published sorted arrow icon
  • declares the height of text fields above the turbo frame

Before:
Screenshot 2024-06-26 at 1 23 55 PM

After:
Screenshot 2024-06-26 at 5 15 40 PM

to avoid layout shift. The reason of the shift
is the width and height of the icon was set to
auto, so when the icon is not loaded yet it displays
"arrow-upward" text which take way more space
comparing to a 18px icon.
This change prevents the vertical layout shift of
turbo frame after the web fonts were loaded.
@another-rex another-rex merged commit da56031 into google:master Jun 27, 2024
11 checks passed
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.

None yet

2 participants