Removes hardcoded body text color from some block patterns

[enriquesanchez]

Fixes #24391

Description

Removes some hardcoded text color values from patterns that have body text with no specific background color. This ensures that it respects the themes default color for body text and avoids contrast issues, particularly in dark themes.

Screenshots

Two columns of text

Before	After

Two columns of text with images

Before	After

Text three columns and buttons

Before	After

Heading and a paragraph

Before	After

Types of changes

Visual changes to block patterns.

[github-actions]

Size Change: +466 B (0%)

Total Size: 1.16 MB

Filename	Size	Change
build/block-editor/index.js	125 kB	+135 B (0%)
build/block-editor/style-rtl.css	10.6 kB	+34 B (0%)
build/block-editor/style.css	10.6 kB	+36 B (0%)
build/block-library/index.js	132 kB	-150 B (0%)
build/block-library/style-rtl.css	7.76 kB	+1 B
build/block-library/style.css	7.77 kB	+1 B
build/blocks/index.js	48.4 kB	+98 B (0%)
build/components/index.js	200 kB	-5 B (0%)
build/components/style-rtl.css	15.7 kB	+2 B (0%)
build/components/style.css	15.7 kB	+2 B (0%)
build/edit-post/index.js	304 kB	+273 B (0%)
build/edit-post/style-rtl.css	5.62 kB	+5 B (0%)
build/edit-post/style.css	5.61 kB	+4 B (0%)
build/editor/index.js	45.3 kB	+29 B (0%)
build/element/index.js	4.65 kB	+1 B

ℹ️ View Unchanged

Filename	Size	Change
build/a11y/index.js	1.14 kB	0 B
build/annotations/index.js	3.67 kB	0 B
build/api-fetch/index.js	3.44 kB	0 B
build/autop/index.js	2.82 kB	0 B
build/blob/index.js	620 B	0 B
build/block-directory/index.js	7.97 kB	0 B
build/block-directory/style-rtl.css	953 B	0 B
build/block-directory/style.css	952 B	0 B
build/block-library/editor-rtl.css	7.59 kB	0 B
build/block-library/editor.css	7.59 kB	0 B
build/block-library/theme-rtl.css	729 B	0 B
build/block-library/theme.css	730 B	0 B
build/block-serialization-default-parser/index.js	1.88 kB	0 B
build/block-serialization-spec-parser/index.js	3.1 kB	0 B
build/compose/index.js	9.68 kB	0 B
build/core-data/index.js	11.8 kB	0 B
build/data-controls/index.js	1.29 kB	0 B
build/data/index.js	8.45 kB	0 B
build/date/index.js	5.38 kB	0 B
build/deprecated/index.js	772 B	0 B
build/dom-ready/index.js	568 B	0 B
build/dom/index.js	3.23 kB	0 B
build/edit-navigation/index.js	10.9 kB	0 B
build/edit-navigation/style-rtl.css	1.08 kB	0 B
build/edit-navigation/style.css	1.08 kB	0 B
build/edit-site/index.js	17 kB	0 B
build/edit-site/style-rtl.css	3.06 kB	0 B
build/edit-site/style.css	3.06 kB	0 B
build/edit-widgets/index.js	9.38 kB	0 B
build/edit-widgets/style-rtl.css	2.45 kB	0 B
build/edit-widgets/style.css	2.45 kB	0 B
build/editor/editor-styles-rtl.css	537 B	0 B
build/editor/editor-styles.css	539 B	0 B
build/editor/style-rtl.css	3.8 kB	0 B
build/editor/style.css	3.79 kB	0 B
build/escape-html/index.js	733 B	0 B
build/format-library/index.js	7.72 kB	0 B
build/format-library/style-rtl.css	547 B	0 B
build/format-library/style.css	548 B	0 B
build/hooks/index.js	2.13 kB	0 B
build/html-entities/index.js	621 B	0 B
build/i18n/index.js	3.56 kB	0 B
build/is-shallow-equal/index.js	711 B	0 B
build/keyboard-shortcuts/index.js	2.52 kB	0 B
build/keycodes/index.js	1.94 kB	0 B
build/list-reusable-blocks/index.js	3.11 kB	0 B
build/list-reusable-blocks/style-rtl.css	476 B	0 B
build/list-reusable-blocks/style.css	476 B	0 B
build/media-utils/index.js	5.33 kB	0 B
build/notices/index.js	1.79 kB	0 B
build/nux/index.js	3.4 kB	0 B
build/nux/style-rtl.css	671 B	0 B
build/nux/style.css	668 B	0 B
build/plugins/index.js	2.56 kB	0 B
build/primitives/index.js	1.41 kB	0 B
build/priority-queue/index.js	789 B	0 B
build/redux-routine/index.js	2.85 kB	0 B
build/rich-text/index.js	13.9 kB	0 B
build/server-side-render/index.js	2.71 kB	0 B
build/shortcode/index.js	1.7 kB	0 B
build/token-list/index.js	1.27 kB	0 B
build/url/index.js	4.06 kB	0 B
build/viewport/index.js	1.85 kB	0 B
build/warning/index.js	1.14 kB	0 B
build/wordcount/index.js	1.17 kB	0 B

_{compressed-size-action}

[mapk]

Most of them worked well for me.

✅ Two columns of text
✅ Two columns of text with images
✅ Three columns of text with buttons
❌ Heading and Paragraph

For some reason, the Heading and Paragraph was showing a block error for me in both the Preview and on the page.

When I attempted the block recovery, it showed the Heading, but without the proper color contrast.

[youknowriad]

I think going forward ideally, it's better to make these fixes in Core itself or in both places. At some point once the plugin will start requiring WP 5.5 as the minimum version, we will be able to remove them entirely from the plugin.

[fullofcaffeine]

Hi @enriquesanchez, thanks a lot for working on this 🙇🏻

I see that @mapk already tested it quite well, but I went ahead and tried it myself, too, nevertheless. Here are my findings:

The "Headings And Paragraphs" pattern shows an "invalid content" error message:

After attempted recovery:

The thumbnail in the inserter is also shown with the error message:

This also happens with these related blocks:

After attempted recovery:

The other blocks changed here looks fine:

I tested locally in a custom wp-env running WP 5.4.2, Gutenberg 8.7 (checked-out and built from within this branch):

and with the Rivington theme activated:

I'm assuming this should be a simple thing to fix. Let me know if I can help!

[enriquesanchez]

Thanks, @fullofcaffeine and @mapk for help testing! 🙌

I think I've fixed the invalid content issue.

[mapk]

It appears to be working great for me now.

Preview

Pattern

[enriquesanchez]

Corresponding Trac ticket for reference: https://core.trac.wordpress.org/ticket/50892