Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Theme.json schema: Remove CSS from block style variations and elements #52217

Closed
carolinan opened this issue Jul 2, 2023 · 1 comment
Closed
Assignees
Labels
CSS Styling Related to editor and front end styles, CSS-specific issues. [Type] Bug An existing feature does not function as intended

Comments

@carolinan
Copy link
Contributor

Description

According to the schema, theme.json allows using "css" under styles > blocks >block name > variations > variation name > css, and styles > elements > element > css.

However, this is not implemented yet, the CSS is not applied in the editors or the front,
and I expect there to be a warning in my code editor if theme.json includes this feature.

Step-by-step reproduction instructions

In theme.json, try to apply custom CSS to a block variation and element.
Note that there are no warnings, and that the styles are not applied in the editor and front.

Example:

	"styles": {
		"blocks": {
      "core/separator": {
				"css": "border:10px solid purple; max-width:100px",
				"variations": {
					"default": {
						"css": "border:10px solid blue"
					},
					"wide": {
						"css": "border:10px solid red"
					}
				}
			},
			"core/button":{
				"variations": {
					"outline": {
						"css": "color:blue"
					}
				}
			}
		},
		"elements": {
			"button": {
				"css": "color:red"
			},
			"heading": {
				"css": "border:10px solid green"
			}
		}
	},

Screenshots, screen recording, code snippet

No response

Environment info

No response

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

@jordesign jordesign added [Type] Bug An existing feature does not function as intended CSS Styling Related to editor and front end styles, CSS-specific issues. labels Jul 7, 2023
@t-hamano t-hamano self-assigned this Jul 30, 2023
@annezazu annezazu moved this to Needs Dev / Todo in WordPress 6.4 Editor Tasks Aug 30, 2023
@t-hamano
Copy link
Contributor

I tested this again and it seems that the css works on both elements and variations in WP6.6.

The screenshot below shows that all of the CSS is applied when using the theme.json provided in this issue.

image

Therefore, I would like to close this issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CSS Styling Related to editor and front end styles, CSS-specific issues. [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants