Ensure new default block patterns are styled correctly in default themes

[desrosj]

WordPress 5.5 will see the introduction of the block pattern API with several patterns included with core by default. The default patterns are currently planned as follows:

• text-two-columns
• two-buttons
• two-images
• text-two-columns-with-images
• text-three-columns-buttons
• large-header
• large-header-paragraph
• three-buttons
• quote

Each default theme should be adjusted if necessary to properly display these patterns both in the editor and on the front end.

See #50550 for the introduction of block patterns in Core.

[justinahinon]

On Twenty Ten, all the default patterns look fine (front and backend) except the two buttons pattern. The default color of the first button make it not lisible at all in the pattern preview and in the editor.

I suspect this to be because of default color that is applied in all elements in the editor

.editor-styles-wrapper * {
    color: #444;
}

in develop.svn.wordpress.org/trunk/src/wp-http://develop.svn.wordpress.org/trunk/src/wp-content/themes/twentyten/editor-style.css #L9

[joyously]

Shouldn't this ticket be on the editor, not the themes? Patterns supplied by core should just work for any theme. The theme shouldn't have to "keep up" and change styles for a new pattern. How could that possibly be sustainable?

[desrosj]

Replying to joyously:

Shouldn't this ticket be on the editor, not the themes? Patterns supplied by core should just work for any theme. The theme shouldn't have to "keep up" and change styles for a new pattern. How could that possibly be sustainable?

Patterns supplied by Core will work, but the editor cannot account for styles in themes that override Core block styling, (unless !important is used heavily, and that's not the right solution), and nor should they. The editor also cannot account for the aesthetics of every theme.

Regardless of what changes are included in a release, every plugin and theme author should always be testing for bugs as new releases become available. It's possible this testing reveals a bug or improvement that can be made in the editor code. But that's what testing is for.

This ticket is to test and verify that the block patterns will work correctly and look natural within each default bundled theme. Because these are the themes that have or will ship with WordPress by default, we have a responsibility to the user base to maintain these themes as best we can. But that's why there is a Bundled Theme component with maintainers.

Based on @justinahinon's testing of Twenty Ten above, there are only a two patterns with issues. I expect this to be the case with each theme (one or two with an issue).

[joyously]

The thing that was pointed out should be fixed in the editor, not the theme.

[poena]

Hi, are the block patterns now final so that we can test?

[youknowriad]

The block patterns in the plugin are close to a final stage for 5.5.
The last update is planned on trunk before the RC1 release. it's tracked here #50550

[nrqsnchz]

I'm still doing one last round of polish based on feedback I've received. I'll update here once I've finalized that.

[nrqsnchz]

All updates and polish to block patterns have finalized, last one was merged a couple of hours ago.

I went ahead and tested the patterns in the last ten core default themes, from Twenty twenty to Twenty ten.

I'm attaching an image with all of these laid out next to each other for better comparison.

[youknowriad]

In 48639:

Block Editor: Update the Core Block Patterns.

Backport the latest block patterns from the Gutenberg plugin.
The new patterns adapt properly to Core themes.

Props nrqsnchz.
Fixes #50550, #50594.