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 theme images loading #2517

Merged
merged 2 commits into from
Jun 11, 2024
Merged

Fix theme images loading #2517

merged 2 commits into from
Jun 11, 2024

Conversation

FireIsGood
Copy link
Contributor

Sanity check:

  • Have you checked to ensure there aren't other open Pull Requests for the same update/change?

The theme images currently have heights equal to one of the images with the other fitting via object-fit: cover. This causes a lot of layout shift and inconsistent heights.

To fix this, I just added an aspect-ratio: 16 / 9 as a progressive enhancement.

Before

Testing with a slower connection to show layouts before the images load:

image

After

Testing with a slower connection to show layouts before the images load:

image

Additional Info

This project's docs site should probably try and find a formatter, as lots of the styles were inconsistent and formatting was most of the diff here. If the maintainer wishes to reduce the diff for this pull request, they may revert/drop the chore: format themes file commit.

@Keats Keats merged commit 0056851 into getzola:master Jun 11, 2024
7 checks passed
@Keats
Copy link
Collaborator

Keats commented Jun 11, 2024

Thanks!

@FireIsGood FireIsGood deleted the fix-theme-images branch June 11, 2024 09:52
berdandy pushed a commit to berdandy/azola that referenced this pull request Sep 17, 2024
* chore: format themes file

* feat: add aspect ratio to theme images
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