search

WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.53k stars 4.21k forks source link

Button: Gradient backgrounds applied in Global Styles cannot be overridden with solid colors at the block level #67055

Open ndiego opened 5 days ago

ndiego commented 5 days ago

Description

If you apply a gradient background to Button blocks in Global Styles → Blocks → Button (or theme.json), users cannot override this gradient background with a solid background color at the block level. They can override it with another gradient background, which makes sense from a technical standpoint but is very unintuitive from a user perspective. You should be able to set the background at the block level, whether you want to apply a gradient or solid color.

Step-by-step reproduction instructions

  1. Set a gradient background on the Button block in Global Styles and save.
  2. Open a new post and add the Buttons block, and add a Button.
  3. Confirm that the Button is displaying the gradient background set in Global Styles.
  4. Try setting a block-level solid background color. Confirm nothing changes.
  5. Now add a block-level gradient background color. Confirm that the new gradient is applied.

Screenshots, screen recording, code snippet

Global Styles Block-level (Solid) Block-level (Gradient)
Image Image Image

Environment info

Please confirm that you have searched existing issues in the repo.

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Please confirm which theme type you used for testing.

im3dabasia commented 4 days ago

I’ve tested this issue and can confirm it’s a bug. A gradient background set in Global Styles cannot be overridden with a solid color at the block level.

carolinan commented 4 days ago

Could we solve this everywhere instead of for one block? https://github.com/WordPress/gutenberg/issues/47391 https://github.com/WordPress/gutenberg/issues/42105

yogeshbhutkar commented 4 days ago

Could we solve this everywhere instead of for one block? #47391

Thanks for the suggestion @carolinan, I'll try to solve it everywhere and update the PR.

yogeshbhutkar commented 4 days ago

@carolinan, The default gradient override bug has now been fixed for all the blocks in the latest patch of the PR.