diff --git a/packages/edit-site/src/components/global-styles/use-global-styles-output.js b/packages/edit-site/src/components/global-styles/use-global-styles-output.js index 189fb3ebbb2586..8aa61a829a9634 100644 --- a/packages/edit-site/src/components/global-styles/use-global-styles-output.js +++ b/packages/edit-site/src/components/global-styles/use-global-styles-output.js @@ -434,9 +434,14 @@ export const getNodesWithStyles = ( tree, blockSelectors ) => { const pickStyleKeys = ( treeToPickFrom ) => pickBy( treeToPickFrom, ( value, key ) => - [ 'border', 'color', 'spacing', 'typography', 'filter' ].includes( - key - ) + [ + 'border', + 'color', + 'spacing', + 'typography', + 'filter', + 'outline', + ].includes( key ) ); // Top-level. @@ -605,12 +610,12 @@ export const toStyles = ( } if ( useRootPaddingAlign ) { - ruleset += `padding-right: 0; padding-left: 0; padding-top: var(--wp--style--root--padding-top); padding-bottom: var(--wp--style--root--padding-bottom) } - .has-global-padding { padding-right: var(--wp--style--root--padding-right); padding-left: var(--wp--style--root--padding-left); } - .has-global-padding :where(.has-global-padding) { padding-right: 0; padding-left: 0; } - .has-global-padding > .alignfull { margin-right: calc(var(--wp--style--root--padding-right) * -1); margin-left: calc(var(--wp--style--root--padding-left) * -1); } - .has-global-padding :where(.has-global-padding) > .alignfull { margin-right: 0; margin-left: 0; } - .has-global-padding > .alignfull:where(:not(.has-global-padding)) > :where([class*="wp-block-"]:not(.alignfull):not([class*="__"]),p,h1,h2,h3,h4,h5,h6,ul,ol) { padding-right: var(--wp--style--root--padding-right); padding-left: var(--wp--style--root--padding-left); } + ruleset += `padding-right: 0; padding-left: 0; padding-top: var(--wp--style--root--padding-top); padding-bottom: var(--wp--style--root--padding-bottom) } + .has-global-padding { padding-right: var(--wp--style--root--padding-right); padding-left: var(--wp--style--root--padding-left); } + .has-global-padding :where(.has-global-padding) { padding-right: 0; padding-left: 0; } + .has-global-padding > .alignfull { margin-right: calc(var(--wp--style--root--padding-right) * -1); margin-left: calc(var(--wp--style--root--padding-left) * -1); } + .has-global-padding :where(.has-global-padding) > .alignfull { margin-right: 0; margin-left: 0; } + .has-global-padding > .alignfull:where(:not(.has-global-padding)) > :where([class*="wp-block-"]:not(.alignfull):not([class*="__"]),p,h1,h2,h3,h4,h5,h6,ul,ol) { padding-right: var(--wp--style--root--padding-right); padding-left: var(--wp--style--root--padding-left); } .has-global-padding :where(.has-global-padding) > .alignfull:where(:not(.has-global-padding)) > :where([class*="wp-block-"]:not(.alignfull):not([class*="__"]),p,h1,h2,h3,h4,h5,h6,ul,ol) { padding-right: 0; padding-left: 0;`; } diff --git a/packages/style-engine/src/styles/outline/index.ts b/packages/style-engine/src/styles/outline/index.ts index c6c3101fa90272..4526b31f1fa40f 100644 --- a/packages/style-engine/src/styles/outline/index.ts +++ b/packages/style-engine/src/styles/outline/index.ts @@ -22,7 +22,7 @@ const offset = { style: Style, options: StyleOptions, path: string[] = [ 'outline', 'offset' ], - ruleKey: string = 'outlineColor' + ruleKey: string = 'outlineOffset' ): GeneratedCSSRule[] => { return generateRule( style, options, path, ruleKey ); },