Directory

Update overlay step function in cover block by akasunil · Pull Request #59891 · WordPress/gutenberg · GitHub
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

Update overlay step function in cover block #59891

Open
wants to merge 12 commits into
base: trunk
Choose a base branch
from

Conversation

akasunil
Copy link
Contributor

What?

Fixes #51625

Why?

Currently, we can set overlay in multiple of 10 in cover block.

How?

I have updated steps to enable any number from 1 to 100 to be set as overlay value.

Testing Instructions

  1. Add cover block
  2. Change overlay
  3. Notice opacity

Screenshots or screencast

CleanShot 2024-03-15 at 12 22 15@2x

Copy link

github-actions bot commented Mar 15, 2024

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: akasunil <sunil25393@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: stokesman <presstoke@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: hanneslsm <hanneslsm@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@skorasaurus skorasaurus added the [Block] Cover Affects the Cover Block - used to display content laid over a background image label Apr 2, 2024
@akasunil akasunil marked this pull request as draft April 19, 2024 06:23
@akasunil
Copy link
Contributor Author

Hi @Mamaduka, need your help with PR review here.

@Mamaduka
Copy link
Member

Hi, @sunil25393

It's been a while since I worked on the Cover block, and I might miss some of the pre-requestions needed for this change. I would recommend contacting folks who worked on the overlay feature "recently". cc @t-hamano, @stokesman

P.S. Removing the has-background-dim-{unit} class can be considered a breaking change, though I don't have any data about their usage in real-world sites.

@akasunil
Copy link
Contributor Author

akasunil commented May 1, 2024

Removing the has-background-dim-{unit} class can be considered a breaking change,

I have kept the css for backward compatibility. We can deprecate it in future version of gutenberg i guess.

@stokesman stokesman added the [Type] Enhancement A suggestion for improvement. label May 3, 2024
@stokesman
Copy link
Contributor

I have kept the css for backward compatibility.

Yes but George was referring to its corresponding class in the markup. There could be instances of CSS written using it in their selectors. Here’s what can be found in themes from wpdirectory. Most of the usage seems odd to me and I'd like to think we can not worry about breakage but I think that’d be against policy.

Otherwise, I gave this a test drive and it worked well. I only tested a basic Cover block created from trunk before switching to this branch and the block updates successfully. I'm not sure how else these types of changes need to be tested.

@akasunil
Copy link
Contributor Author

akasunil commented May 4, 2024

There could be instances of CSS written using it in their selectors.

Thank you for your reply. I see it now. However, if we leave the class selectors, opacity will be applied twice. There is no significance to it. Is there a workaround for this? We can always update the changelog, though.

@stokesman
Copy link
Contributor

I took a closer look at the selectors used in the themes from that search and all of them that I saw are written for older cover block versions which had the has-background-dim-{unit} class directly on the block’s root element. So those styles wouldn’t be applying to more recent cover block versions anyway. I.e. this change won’t break those styles.

Yet I didn’t examine all the results because they are many (though it appears they are all repetitions of what I did examine). I wanted to try a more exacting regex to find results that aren’t paired up with wp-cover-block classes but didn’t see a way to do it that’s supported by WP Directory’s regex interpreter.

I've also ran the search on plugins. There are some results though it appears that they are for custom blocks that adopted the use of the class and so should be unaffected by this change. For example, I tested the most installed plugin in the results (WooCommerce) and the class is used on their Featured Product block that has nothing to do with Cover.

My feeling is that this should be safe to ship as is but I don’t know the level of caution others might think is warranted.

@akasunil
Copy link
Contributor Author

Thank you for investing @stokesman, @t-hamano can we get your view on this ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Cover Affects the Cover Block - used to display content laid over a background image [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Cover Block: Overlay is only possible in 10-steps instead of 1 - Disable Rounding
4 participants