Skip to content

Image: Fix layout shift when lightbox is opened and closed #53026

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.

Sign up for GitHub

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

Merged
artemiomorales merged 13 commits into from
Sep 28, 2023
Merged

Image: Fix layout shift when lightbox is opened and closed #53026

Changes from 1 commit
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
3a43283
Replace overflow: hidden with JavaScript callback to prevent scrolling
artemiomorales Aug 15, 2023
c438e15
Disable scroll callback on mobile; add comments; fix scrim styles
artemiomorales Aug 16, 2023
4168036
Add handling for horizontally oriented pages
artemiomorales Aug 16, 2023
564db4c
Move close button so that it's further from scrollbar on desktop
artemiomorales Aug 16, 2023
2f7af76
Fix call to handleScroll() and add touch callback to new render method
artemiomorales Sep 20, 2023
2c94042
Improve lightbox experience on mobile
artemiomorales Sep 27, 2023
aa2b495
Fix spacing
artemiomorales Sep 27, 2023
2e38ab0
Add touch directives to block supports
artemiomorales Sep 27, 2023
59d32e8
Fix spacing in block supports
artemiomorales Sep 27, 2023
057a164
Rename attribute for clarity
artemiomorales Sep 28, 2023
dc7a8b4
Update comment
artemiomorales Sep 28, 2023
734096a
Update comments
artemiomorales Sep 28, 2023
82eb2ba
Fix spacing
artemiomorales Sep 28, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Update comment
  • Loading branch information
@artemiomorales
artemiomorales committed Sep 28, 2023
commit dc7a8b43e50ab20201bd170d369780003cce34b5
3 changes: 1 addition & 2 deletions packages/block-library/src/image/view.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,8 +111,7 @@ store(
hideLightbox: async ( { context } ) => {
context.core.image.hideAnimationEnabled = true;
if ( context.core.image.lightboxEnabled ) {
// The lightbox will close once it detects a scroll event,
// but we want to wait until the close animation is completed
// We want to wait until the close animation is completed
// before allowing a user to scroll again. The duration of this
// animation is defined in the styles.scss and depends on if the
// animation is 'zoom' or 'fade', but in any case we should wait
Expand Down