-
Notifications
You must be signed in to change notification settings - Fork 0
Issue #9 - Allow block to be resized #13
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
Conversation
Just having a look at this functionally and noticed that the height doesn't seem to be dynamically resizing in the same way as it might be in your demo - http://bigbite.im/v/laF0N8 Not sure if that's a version / browser issue? |
It looks like the CSS which contains the images isn't being picked up in the editor so the original image aspect ratio is being displayed. I'm struggling to replicate it at the moment but it may be a browser / caching issue. I've mainly tested in Arc so will try in Chrome / Firefox 👍 |
I'm unfortunately still struggling to replicate the image height bug that @jonnywatersbb experienced - testing carried out in Arc, Chrome, and Firefox. Demo showing how the block works for me can be seen here Steps taken with the aim to replicate the issue:
If anyone has any suggestions it would be greatly appreciated! |
Interestingly, I'm seeing the same behaviour as @jonnywatersbb in Chrome running WP 6.6-RC2-58675 with both twentytwentythree and twentytwentyfour. |
Thanks for confirming @jaymcp, much appreciated. Back to the drawing board to figure this one out! |
src/blocks/image-comparison/components/SettingsContainerSize.js
Outdated
Show resolved
Hide resolved
In an attempt to recreate the block resize bug (where the images are displayed outside of the block's bounds), I created a new docker instance on a fresh URL and checked out the repo fresh into the new WP install. I recorded another short demo showing the results (still unable to replicate, unfortunately). Steps taken:
I also tried following the same steps (of adding the block) in an incognito window and specifically clearing the browser cache and re-adding the block. Details: WP 6.5, PHP 8.2, Arc v1.49.1 (51495) |
Hey @jaymcp Can you confirm if you have any other plugins running on the site when you are seeing the same bug as me? I've just created a blank site and checked the PR out on the exact same setup as previous and didn't see the bug. Comparing the 2 environments, I have a feeling it's another plugin (probably Tabs) causing the issue. |
@jonnywatersbb did a retest after deactivating all but required plugins... unfortunately i still see the same thing. i'll try with a fresh env on a stable wp release. |
@thatisrich I'm not seeing the issue I was on a blank WordPress install, so I'm wondering if all the other PR feedback from Jay has been addressed, if we look to approve and merge this along with #17 and do a full test of a release candidate? Although I may need Jay or someone else to just approve the PR from a code POV |
@jonnywatersbb The PR feedback has been taken care of so, if those changes are good to go, re-running tests after merge to a possible release branch sounds like a plan. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The code looks great (thanks for addressing the feedback, @thatisrich)!
Here's a new video demonstrating the issue we've been discussing:
image-comparison-issue-9.mp4
Approving the PR anyway, per the discussion in the ticket.
@thatisrich There's a couple of merge conflicts that we need resolving before we can merge this. |
# Conflicts: # src/blocks/image-comparison/components/Edit.js # src/blocks/image-comparison/components/Settings.js
@ampersarnie The merge conflict has been address and re-tested. A demo showing the block working after the conflict can be seen here. Thanks! |
Description
Issue #9 - The image comparison block's dimensions are defined by the first image uploaded to the block. This change allows the dimensions of the block to be adjusted further to the initial size of the first image added.
Change Log
block.json
new container height and width attributes have been added.Steps to test
npm run build:prod
to ensure up to date codeScreenshots/Videos
A video showing the resize container in action
A screenshot showing a width restricted block and caption
Checklist: