Reset "Expand on click" image styles when window is resized #55077
Conversation
This file contains 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
SantosGuillamot
added
[Type] Bug
SantosGuillamot
requested review from
artemiomorales and
michalczaplinski
as code owners
SantosGuillamot
changed the title
|
Size Change: +24 B (0%) Total Size: 1.65 MB
ℹ️ View Unchanged
|
|
Flaky tests detected in 35f2b39. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/6436135285
|
69 tasks
artemiomorales
force-pushed
the
experiment/set-lightbox-styles-on-resize
branch
from
b9ee8b2
to
35f2b39
Compare
artemiomorales
approved these changes
Oct 6, 2023
There was a problem hiding this comment.
@SantosGuillamot This looks good to me. I rebased on trunk and modified the code slightly to account for changes in logic, namely using the event.target.previousElementSibling instead of event.target.nextElementSibling, but otherwise I think this is good to go.
If all looks good to you, I think we can merge 👍
artemiomorales
added
the
Backport to WP Beta/RC
mikachan
pushed a commit
that referenced
this pull request
Oct 10, 2023
Co-authored-by: Ricardo Artemio Morales <ric.morales22@gmail.com>
|
I just cherry-picked this PR to the 6.4-beta3-2 branch to get it included in the next release: 3d1200b |
mikachan
removed
the
Backport to WP Beta/RC
karmatosed
pushed a commit
that referenced
this pull request
Oct 10, 2023
* Site Editor Styles Screen: Fix dancing styles previews (#55183) * Pulling across changes from WordPress/wordpress-develop#5441 (#55181) Removed var * Add `aria-label` attribute to navigation block only when it is open (#54816) * Add `aria-label` only when is open * Remove unnecessary `label` property in edit * Escape translation * Move navigation context to `wp_json_encode` * Add `wp_json_encode` flags * Paste: fix MS Word list paste (#55127) * Paste: fix MS Word list paste * Match mso-list:Ignore * Fix inline paste * Fix scrollbars on pattern transforms (#55069) * Fix scrollbars on pattern transforms * Fix single pattern previews * Improve classname semantics * Remove modal title * Reset styles on window resize (#55077) Co-authored-by: Ricardo Artemio Morales <ric.morales22@gmail.com> --------- Co-authored-by: Andrew Serong <14988353+andrewserong@users.noreply.github.com> Co-authored-by: Ramon <ramonjd@users.noreply.github.com> Co-authored-by: Mario Santos <34552881+SantosGuillamot@users.noreply.github.com> Co-authored-by: Ella <4710635+ellatrix@users.noreply.github.com> Co-authored-by: Daniel Richards <daniel.richards@automattic.com> Co-authored-by: Ricardo Artemio Morales <ric.morales22@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
What?
Fix a bug where the "Expand on click" functionality doesn't work properly when resizing the window. Reported here.
Why?
It breaks somehow the experience when you change the window size.
How?
I added an effect that listens to the window height and width stored in the
stateand it is triggered when they change. In that effect, it recalculates the styles.Testing Instructions
Before this pull request
You should see that the width of the image is not correct and the zooming out is broken.
After this pull request
You should see that the width of the image is corrected and the zooming works fine.
Screenshots or screencast
Before this pull request
Lightbox.test64.-.5.October.2023.1.mp4
After this pull request
Lightbox.test64.-.5.October.2023.mp4