Open bph opened 1 year ago
Noting that I can't get the gradient to show up at all (editor or front end) with 6.3.1 with or without GB 16.6 active:
https://github.com/WordPress/gutenberg/assets/26996883/334986e2-68e4-4334-8f78-a35512f90fdb
I can confirm that gradient presets are not working in the latest Gutenberg 16.6.
Here's a rough fix for gradient presets (haven't solved custom gradients yet) that I added in my theme stylesheet:
.wp-block-separator.has-background[class*=-gradient] {
border: none;
height: 2px;
}
After a review by core editor triage leads and core editor tech leads, this has been removed from the board for 6.5 consideration.
Just revisiting this against WP 6.5/trunk and Gutenberg 17.7 RC1.
Custom gradients don't work at all because the gradient isn't applied to the block markup. The best way for theme authors to fix the UX for their users is to disable custom gradients for the Separator block in theme.json
(assuming they have custom gradients enabled globally).
{
"$schema": "https://schemas.wp.org/trunk/theme.json",
"version": 2,
"settings": {
"blocks": {
"core/separator": {
"color": {
"customGradient": false
}
}
}
}
}
Theme, default, and user-defined gradients, however, can work because the gradient class is applied to <hr>
element. It just needs a bit of CSS:
.wp-block-separator.has-background[class*=-gradient] {
border: none;
height: 2px;
}
The height
can be whatever you want.
Description
When changing the background on a separator block, using the solid colors or the presets choices on the Gradient tool, everything works. But as soon as a user tries to use the sliders in the Gradient tool to modify it, the separator block visually disappears from the Editor as well as the front end.
Step-by-step reproduction instructions
Screenshots, screen recording, code snippet
In this video you can first see that the present gradient works. The when I try to change the colors it disappears.
https://github.com/WordPress/gutenberg/assets/39980/0b6bf771-3806-40c6-854e-61e32ec6dbc5
Environment info
WordPress 6.3-RC2 but I also was able to reproduce on WordPress 6.2.2 Twenty Twenty-Two theme.
Chrome 114.0.5735.248 Firefox Developer Edition: 116.0b7 MacOS 13.3.1
Please confirm that you have searched existing issues in the repo.
Yes
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Yes