Calendly: Fix the overlay when the block is left or right aligned #14820
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
In WordPress/gutenberg#19593 a wrapper `div` was removed, which had a `position` value of `relative`. Our overlay `div` to prevent the iframe from being interacted with, relies on a parent element being `positino: relative`. This is still the case when the block is in the main flow/centre aligned, but when the block is left or right aligned, it can't be selected, and clicks are handled by the iframe. I think the above PR is in Gutenberg 7.3 and higher, so this problem can be replicated with the plugin installed, and therefore also on WPCOM.
|
Caution: This PR has changes that must be merged to WordPress.com |
pablinos
added
[Block] Calendly
[Status] Needs Review
|
Thank you for the great PR description! When this PR is ready for review, please apply the Scheduled Jetpack release: March 3, 2020. |
jeherve
added
[Status] Needs Cherry-Pick
[Status] Ready to Merge
jeherve
approved these changes
Feb 27, 2020
|
pablinos, Your synced wpcom patch D39475-code has been updated. |
|
Simple Note - Test Failure was due to instability at time of the test execution, rebase and re-run of tests succeeded. Moving forward with Merge |
matticbot
added
[Status] Needs Changelog
and removed
[Status] Ready to Merge
mdbitz
pushed a commit
that referenced
this pull request
Feb 27, 2020
#14820) In WordPress/gutenberg#19593 a wrapper `div` was removed, which had a `position` value of `relative`. Our overlay `div` to prevent the iframe from being interacted with, relies on a parent element being `positino: relative`. This is still the case when the block is in the main flow/centre aligned, but when the block is left or right aligned, it can't be selected, and clicks are handled by the iframe.
|
Cherry-Picked into Release branch-8.3 in d4eb752 |
apeatling
added a commit
that referenced
this pull request
Feb 27, 2020
…t the iframe cannot be interacted with when alignment is set. See #14820
mdbitz
added a commit
that referenced
this pull request
Feb 27, 2020
mdbitz
added a commit
that referenced
this pull request
Feb 27, 2020
|
Change Log added to release in 044b064 |
|
r203588-wpcom |
scruffian
added a commit
that referenced
this pull request
Mar 5, 2020
* Eventbrite Alignment: Add left, center, right alignment support to the Eventbrite block. Fixes #14505 * Eventbrite Alignment: Add position relative to block to make sure that the iframe cannot be interacted with when alignment is set. See #14820 * Eventbrite Alignment: Make sure the alignment classes are added to the server side rendered iframe embed. * Use the block_classes helper function and escape the result * Update the CSS to target the new class name * Add support for wide and full alignments Co-authored-by: Ben Dwyer <[email protected]>
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.
In WordPress/gutenberg#19593 a wrapper
divwas removed, which had apositionvalue ofrelative. Our overlaydivto prevent the iframefrom being interacted with, relies on a parent element being
positino: relative. This is still the case when the block is in themain flow/centre aligned, but when the block is left or right aligned,
it can't be selected, and clicks are handled by the iframe.
Changes proposed in this Pull Request:
This simply adds
position:relativeto the block container, so the overlay always covers it.Is this a new feature or does it add/remove features to an existing part of Jetpack?
This is a bug fix
Testing instructions:
Proposed changelog entry for your changes:
Bug fixed that caused the overlay not to render properly for the Calendly block in the editor.