Skip to content
This repository has been archived by the owner on Jan 24, 2024. It is now read-only.

Minimize loss of block contrast when changing global style #713

Closed
tenman opened this issue Oct 31, 2023 · 2 comments
Closed

Minimize loss of block contrast when changing global style #713

tenman opened this issue Oct 31, 2023 · 2 comments
Labels
[Type] Bug Something isn't working

Comments

@tenman
Copy link

tenman commented Oct 31, 2023

Description
Global style changes occur independently of palette settings.
In some parts of Twenty Twenty Four / theme.json, --wp--preset--color--contrast-2 (text color) is specified,
This causes several blocks to lose contrast.

Step-by-step reproduction instructions
1 Set the background color of the global style to black and the text color to white.
2 Check the contrast of wp-block-post-date, wp-block-post-terms, wp-block-site-tagline, wp-block-quote in the front end.
3, Delete "color": {"background": "var(--wp--preset--color--base-2)"}, from each block in theme.json.
4 Check the contrast change on the front end.
Expected behavior
the text color of the body element is inherited.

Screenshots

Environment info

Additional context
Try creating a new post in Step 1.
The post title will be the same as the background color, making it difficult to type.
.is-dark-theme .wp-block-post-title{ color:#fff; }

In Step2, check the change in the background of header.html
Because the backgroundColor is specified, it will probably appear with a different background than the theme intended.

<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"20px","bottom":"20px"}}},"backgroundColor":"base","color":"contrast","layout":{"type":"constrained"}} -->

@tenman tenman added the [Type] Bug Something isn't working label Oct 31, 2023
@carolinan
Copy link
Contributor

If anyone changes the background colors, it is also their own responsibility to make texts readable.

@luminuu
Copy link
Member

luminuu commented Oct 31, 2023

As Carolina pointed out correctly, it's not a bug in the theme. The accessibility-readiness of the theme is referring to the colors provided by default. Since the blocks you pointed out have different colors from the main text color, you need to override them as well individually in the global styles.

Since it's not a bug of the theme, I'm closing this issue.

@luminuu luminuu closed this as completed Oct 31, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
[Type] Bug Something isn't working
3 participants