diff --git a/blank-canvas-blocks/assets/ponyfill.css b/blank-canvas-blocks/assets/ponyfill.css index 3baa6cdaa4..774b37c451 100644 --- a/blank-canvas-blocks/assets/ponyfill.css +++ b/blank-canvas-blocks/assets/ponyfill.css @@ -77,24 +77,27 @@ body { .wp-site-blocks *[class*="__inner-container"] > .wp-block-group, .wp-site-blocks > *:not(.wp-block-post-content):not(.wp-block-template-part), -.wp-site-blocks .wp-block-post-content > * { +.wp-block-post-content > * { max-width: var(--wp--custom--width--default); margin-left: auto; margin-right: auto; - padding: 0 var(--wp--custom--margin--horizontal); + padding-left: var(--wp--custom--margin--horizontal); + padding-right: var(--wp--custom--margin--horizontal); } .wp-site-blocks *[class*="__inner-container"] > .alignwide, -.wp-site-blocks .alignwide { +.alignwide { width: var(--wp--custom--width--wide); max-width: 100%; } .wp-site-blocks *[class*="__inner-container"] > .alignfull, -.wp-site-blocks .alignfull { +.alignfull { max-width: unset; margin-left: unset; margin-right: unset; + padding-left: unset; + padding-right: unset; } .aligncenter { @@ -473,4 +476,13 @@ p.has-drop-cap:not(:focus):first-letter { text-align: var(--wp--custom--video--caption--text-align); } +.wp-block-code { + border-radius: var(--wp--custom--code--border--radius); + border-width: var(--wp--custom--code--border--width); + border-style: var(--wp--custom--code--border--style); + border-color: var(--wp--custom--code--border--color); + color: var(--wp--custom--code--color--text); + background-color: var(--wp--custom--code--color--background); +} + /*# sourceMappingURL=ponyfill.css.map */ \ No newline at end of file diff --git a/blank-canvas-blocks/experimental-theme.json b/blank-canvas-blocks/experimental-theme.json index f0f5750bcc..3d27278c5b 100644 --- a/blank-canvas-blocks/experimental-theme.json +++ b/blank-canvas-blocks/experimental-theme.json @@ -180,6 +180,18 @@ "left": "calc( 2 * var(--wp--custom--padding--horizontal) )" } }, + "code": { + "color": { + "text": "inherit", + "background": "none" + }, + "border": { + "radius": "0", + "color": "#cccccc", + "width": "2px", + "style": "solid" + } + }, "navigation": { "mobile": { "menu": { diff --git a/blank-canvas-blocks/sass/base/_alignment.scss b/blank-canvas-blocks/sass/base/_alignment.scss index 71b9c32ea8..bff98f1a9a 100644 --- a/blank-canvas-blocks/sass/base/_alignment.scss +++ b/blank-canvas-blocks/sass/base/_alignment.scss @@ -15,26 +15,29 @@ body { // This is the default with of blocks on the page with not assign alignwide or alignfull .wp-site-blocks *[class*="__inner-container"] > .wp-block-group, .wp-site-blocks > *:not(.wp-block-post-content):not(.wp-block-template-part), -.wp-site-blocks .wp-block-post-content > * { +.wp-block-post-content > * { max-width: var(--wp--custom--width--default); margin-left: auto; margin-right: auto; - padding: 0 var(--wp--custom--margin--horizontal); + padding-left: var(--wp--custom--margin--horizontal); + padding-right: var(--wp--custom--margin--horizontal); } // Align the block to be on the "wider" side of things .wp-site-blocks *[class*="__inner-container"] > .alignwide, -.wp-site-blocks .alignwide { +.alignwide { width: var(--wp--custom--width--wide); max-width: 100%; } // The block should span the full width of the page .wp-site-blocks *[class*="__inner-container"] > .alignfull, -.wp-site-blocks .alignfull { +.alignfull { max-width: unset; margin-left: unset; margin-right: unset; + padding-left: unset; + padding-right: unset; } // Align Center diff --git a/blank-canvas-blocks/sass/blocks/_code.scss b/blank-canvas-blocks/sass/blocks/_code.scss new file mode 100644 index 0000000000..c2a12e8664 --- /dev/null +++ b/blank-canvas-blocks/sass/blocks/_code.scss @@ -0,0 +1,9 @@ +// TODO: This shouldn't be necessary when either of these land: https://github.com/WordPress/gutenberg/pull/27582 || https://github.com/WordPress/gutenberg/issues/29778 +.wp-block-code { + border-radius: var(--wp--custom--code--border--radius); + border-width: var(--wp--custom--code--border--width); + border-style: var(--wp--custom--code--border--style); + border-color: var(--wp--custom--code--border--color); + color: var(--wp--custom--code--color--text); + background-color: var(--wp--custom--code--color--background); +} \ No newline at end of file diff --git a/blank-canvas-blocks/sass/ponyfill.scss b/blank-canvas-blocks/sass/ponyfill.scss index 6f711a92fc..8321e1a779 100644 --- a/blank-canvas-blocks/sass/ponyfill.scss +++ b/blank-canvas-blocks/sass/ponyfill.scss @@ -20,3 +20,4 @@ @import "blocks/group"; @import "blocks/separator"; @import "blocks/video"; +@import "blocks/code";