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

Shadow: add shadow presets support via theme.json #46813

Merged
merged 1 commit into from Dec 29, 2022

Conversation

madhusudhand
Copy link
Contributor

@madhusudhand madhusudhand commented Dec 29, 2022

What?

This adds support for default and theme shadow presets via theme.json

It ads following default presets to Gutenberg bundled theme.json

  • Natural
  • Sharp

Testing Instructions

  1. This change should create two default preset variables --wp--preset--shadow--natural and --wp--preset--shadow--sharp in global style sheet.
  2. Add the following styles in the current active theme.
"settings": {
		"shadow": {
			"palette": [
				{
					"name": "Natural",
					"slug": "theme-natural",
					"shadow": "5px 5px 0px -2px #FFFFFF, 5px 5px #000000"
				},
				{
					"name": "Crisp",
					"slug": "theme-crisp",
					"shadow": "5px 5px #000000"
				},
				{
					"name": "Sharp",
					"slug": "theme-sharp",
					"shadow": "5px 5px 0 0 #999999"
				},
				{
					"name": "Soft",
					"slug": "theme-soft",
					"shadow": "5px 5px 10px 0 #999999"
				}
			]
		}
}
  1. Verify that it creates the respective preset variables in global style sheet.
  2. Apply shadow to any block such as button in the current active theme.
{
    "styles": {
         "elements": {
              "button": {
                  "shadow": "var(--wp--preset--shadow--natural)"
              }
         }
    }
}
  1. Verify the button shadow.

This is a PR to add support via theme.json.
Verify end to end feature including UI in global styles from here #46502

Related issues

Partial Fix for #44651

update shadow values

fetch the updated core theme.json file

update class name of json ressolver
Copy link
Member

@oandregal oandregal left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for splitting the work in smaller steps!

I've tested a variety of scenarios: defining the presets in the theme.json of the theme instead of using the theme.json bundled by Gutenberg, using the shadow in a block. I've also tested that style variations work the same as the main theme.json of the theme (needed to merge #46810 into this one). This is ready to ship.

@oandregal oandregal merged commit aa5bca2 into trunk Dec 29, 2022
@oandregal oandregal deleted the shadow-presets-themejson branch December 29, 2022 11:23
@github-actions github-actions bot added this to the Gutenberg 14.9 milestone Dec 29, 2022
pento pushed a commit to WordPress/wordpress-develop that referenced this pull request Feb 1, 2023
Adds shadow presets support for `theme.json` within the `WP_Theme_JSON` by 

* Adding it to presets metadata and valid settings.
* Defining the default shadow presets in Core's `theme.json`.

Includes PHPUnit tests. 

References:
* [WordPress/gutenberg#46813 Gutenberg PR 46813]
* [WordPress/gutenberg#47272 Gutenberg PR 47272]

Follow-up to [54162], [52049], [50973].

Props madhudollu, mamaduka, oandregal, scruffian, hellofromTonya.
Fixes #57559.

git-svn-id: https://develop.svn.wordpress.org/trunk@55176 602fd350-edb4-49c9-b593-d223f7449a82
markjaquith pushed a commit to markjaquith/WordPress that referenced this pull request Feb 1, 2023
Adds shadow presets support for `theme.json` within the `WP_Theme_JSON` by 

* Adding it to presets metadata and valid settings.
* Defining the default shadow presets in Core's `theme.json`.

Includes PHPUnit tests. 

References:
* [WordPress/gutenberg#46813 Gutenberg PR 46813]
* [WordPress/gutenberg#47272 Gutenberg PR 47272]

Follow-up to [54162], [52049], [50973].

Props madhudollu, mamaduka, oandregal, scruffian, hellofromTonya.
Fixes #57559.
Built from https://develop.svn.wordpress.org/trunk@55176


git-svn-id: http://core.svn.wordpress.org/trunk@54709 1a063a9b-81f0-0310-95a4-ce76da25c4cd
github-actions bot pushed a commit to platformsh/wordpress-performance that referenced this pull request Feb 1, 2023
Adds shadow presets support for `theme.json` within the `WP_Theme_JSON` by 

* Adding it to presets metadata and valid settings.
* Defining the default shadow presets in Core's `theme.json`.

Includes PHPUnit tests. 

References:
* [WordPress/gutenberg#46813 Gutenberg PR 46813]
* [WordPress/gutenberg#47272 Gutenberg PR 47272]

Follow-up to [54162], [52049], [50973].

Props madhudollu, mamaduka, oandregal, scruffian, hellofromTonya.
Fixes #57559.
Built from https://develop.svn.wordpress.org/trunk@55176


git-svn-id: https://core.svn.wordpress.org/trunk@54709 1a063a9b-81f0-0310-95a4-ce76da25c4cd
VenusPR added a commit to VenusPR/Wordpress_Richard that referenced this pull request Mar 9, 2023
Adds shadow presets support for `theme.json` within the `WP_Theme_JSON` by 

* Adding it to presets metadata and valid settings.
* Defining the default shadow presets in Core's `theme.json`.

Includes PHPUnit tests. 

References:
* [WordPress/gutenberg#46813 Gutenberg PR 46813]
* [WordPress/gutenberg#47272 Gutenberg PR 47272]

Follow-up to [54162], [52049], [50973].

Props madhudollu, mamaduka, oandregal, scruffian, hellofromTonya.
Fixes #57559.
Built from https://develop.svn.wordpress.org/trunk@55176


git-svn-id: http://core.svn.wordpress.org/trunk@54709 1a063a9b-81f0-0310-95a4-ce76da25c4cd
@madhusudhand madhusudhand mentioned this pull request Dec 15, 2023
7 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants