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

Refactor Featured Image Block to use aspectRatio block support #61432

Open
fabiankaegy opened this issue May 7, 2024 · 3 comments · May be fixed by #61485
Open

Refactor Featured Image Block to use aspectRatio block support #61432

fabiankaegy opened this issue May 7, 2024 · 3 comments · May be fixed by #61485
Labels
[Block] Post Featured Image Affects the Post Featured Image Block [Type] Enhancement A suggestion for improvement.

Comments

@fabiankaegy
Copy link
Member

The featured image block currently has a manual control for handling the Aspect Ratio setting. This is redundant because we now have the aspectRatio block support which can handle this for us.

@fabiankaegy fabiankaegy added [Type] Code Quality Issues or PRs that relate to code quality [Block] Post Featured Image Affects the Post Featured Image Block labels May 7, 2024
@hbhalodia
Copy link
Contributor

Hi @fabiankaegy, I would like to take this up. I have scratch up my head a bit and found that we need to add the dimension support for the featured image and image core block. I have tried to implement the same, but seems to be a little tricky.

We need to remove the aspectRatio attribute from the attributes, but by removing this there are some functionality that is being used in the dimension control like, scale options

const showScaleControl =
height || ( aspectRatio && aspectRatio !== 'auto' );
which would be not being in use if we remove that. Once we remove that, since aspect ratio would be added to the main wrapper, that is figure here in case, for which we need to add the height and width 100% to make that work, which is also written based on the aspect ratio attribute
if ( ! empty( $attributes['aspectRatio'] ) ) {
$extra_styles .= 'width:100%;height:100%;';

Now, if we need to remove the aspectRatio from attribute, we also need to make sure the backward compatibility for the same as well like deprecation something like that.

So can you please guide me on this, how can we approach this and what could be the starting point.

I tried to take some reference from the cover block, but it does not include the actual thing, it just has the aspectRatio dimension in the block support.

I see some reference 2e01f22#diff-7a048d7d7e1773a2805d9c622740508c9572015140912830a9ac81d5a0f9fe01 for the cover block. I hope this can be act as starting point for the same.

Thank You ✨.

@Mamaduka Mamaduka added [Type] Enhancement A suggestion for improvement. and removed [Type] Code Quality Issues or PRs that relate to code quality labels May 7, 2024
@hbhalodia
Copy link
Contributor

Hi @Mamaduka @fabiankaegy

I have raised the PR - #61485, to update the core/post-featured-image block to use the block Supports, dimensions aspectRatio instead of the aspectRatio attributes. Request you to review the PR and provide the suitable improvements.

Thank You 🙏.

@Mamaduka
Copy link
Member

Mamaduka commented May 8, 2024

Thank you, @hbhalodia!

I'll try to have a look as soon as I've some free time.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Post Featured Image Affects the Post Featured Image Block [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants