From 091806675c06a2a46f823401951076491f6f41f7 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Fri, 21 Oct 2022 10:36:04 +0200 Subject: [PATCH 1/5] Preformatted: Add spacing support --- docs/reference-guides/core-blocks.md | 2 +- packages/block-library/src/preformatted/block.json | 4 ++++ packages/block-library/src/preformatted/style.scss | 2 ++ 3 files changed, 7 insertions(+), 1 deletion(-) diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index f637cce568b14d..42308e2714191d 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -590,7 +590,7 @@ Add text that respects your spacing and tabs, and also allows styling. ([Source] - **Name:** core/preformatted - **Category:** text -- **Supports:** anchor, color (background, gradients, text), typography (fontSize, lineHeight) +- **Supports:** anchor, color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight) - **Attributes:** content ## Pullquote diff --git a/packages/block-library/src/preformatted/block.json b/packages/block-library/src/preformatted/block.json index bab40b94a7ec46..ed109262fd3ff4 100644 --- a/packages/block-library/src/preformatted/block.json +++ b/packages/block-library/src/preformatted/block.json @@ -25,6 +25,10 @@ "text": true } }, + "spacing": { + "margin": true, + "padding": true + }, "typography": { "fontSize": true, "lineHeight": true, diff --git a/packages/block-library/src/preformatted/style.scss b/packages/block-library/src/preformatted/style.scss index 71e60ffe4ea529..2e34bab22cac91 100644 --- a/packages/block-library/src/preformatted/style.scss +++ b/packages/block-library/src/preformatted/style.scss @@ -1,4 +1,6 @@ .wp-block-preformatted { + // This block has customizable padding, border-box makes that more predictable. + box-sizing: border-box; white-space: pre-wrap; } From f08c6d0097491970d8fd0db0c1a93aa88d1e01da Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Tue, 7 Mar 2023 08:36:13 +0100 Subject: [PATCH 2/5] Remove margin block support --- docs/reference-guides/core-blocks.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index c03e20391d61a4..051c09cad56098 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -608,7 +608,7 @@ Add text that respects your spacing and tabs, and also allows styling. ([Source] - **Name:** core/preformatted - **Category:** text -- **Supports:** anchor, color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight) +- **Supports:** anchor, color (background, gradients, text), spacing (padding), typography (fontSize, lineHeight) - **Attributes:** content ## Pullquote From 4fa7c413f4fd7b72401a35f46f28185c7977a2f8 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Tue, 7 Mar 2023 08:36:34 +0100 Subject: [PATCH 3/5] Update block.json --- packages/block-library/src/preformatted/block.json | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/block-library/src/preformatted/block.json b/packages/block-library/src/preformatted/block.json index ed109262fd3ff4..32068d4ea1458e 100644 --- a/packages/block-library/src/preformatted/block.json +++ b/packages/block-library/src/preformatted/block.json @@ -26,7 +26,6 @@ } }, "spacing": { - "margin": true, "padding": true }, "typography": { From 8eb73f8ba5fffff5449b0b587550309b31663536 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Fri, 12 May 2023 07:55:52 +0200 Subject: [PATCH 4/5] Move the background padding styles --- packages/block-library/src/preformatted/style.scss | 4 ---- packages/block-library/src/preformatted/theme.scss | 4 ++++ packages/block-library/src/theme.scss | 1 + 3 files changed, 5 insertions(+), 4 deletions(-) create mode 100644 packages/block-library/src/preformatted/theme.scss diff --git a/packages/block-library/src/preformatted/style.scss b/packages/block-library/src/preformatted/style.scss index 2e34bab22cac91..36d90b3152018b 100644 --- a/packages/block-library/src/preformatted/style.scss +++ b/packages/block-library/src/preformatted/style.scss @@ -3,7 +3,3 @@ box-sizing: border-box; white-space: pre-wrap; } - -.wp-block-preformatted.has-background { - padding: $block-bg-padding--v $block-bg-padding--h; -} diff --git a/packages/block-library/src/preformatted/theme.scss b/packages/block-library/src/preformatted/theme.scss new file mode 100644 index 00000000000000..643a7f5a6d7f17 --- /dev/null +++ b/packages/block-library/src/preformatted/theme.scss @@ -0,0 +1,4 @@ +// Add low specificity default padding when a background is used. +:where(.wp-block-preformatted.has-background) { + padding: $block-bg-padding--v $block-bg-padding--h; +} diff --git a/packages/block-library/src/theme.scss b/packages/block-library/src/theme.scss index 1c27a7b0e32c58..8059aa49596295 100644 --- a/packages/block-library/src/theme.scss +++ b/packages/block-library/src/theme.scss @@ -7,6 +7,7 @@ @import "./quote/theme.scss"; @import "./search/theme.scss"; @import "./group/theme.scss"; +@import "./preformatted/theme.scss"; @import "./separator/theme.scss"; @import "./table/theme.scss"; @import "./video/theme.scss"; From 01a34c2ee93ca1e38e950819d69768c659c87660 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Thu, 25 May 2023 08:12:18 +0200 Subject: [PATCH 5/5] restore the background color padding, add margin support for testing --- docs/reference-guides/core-blocks.md | 2 +- packages/block-library/src/preformatted/block.json | 3 ++- packages/block-library/src/preformatted/style.scss | 5 +++++ packages/block-library/src/preformatted/theme.scss | 4 ---- packages/block-library/src/theme.scss | 1 - 5 files changed, 8 insertions(+), 7 deletions(-) delete mode 100644 packages/block-library/src/preformatted/theme.scss diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index 80e525449e1785..14d6318ec50870 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -638,7 +638,7 @@ Add text that respects your spacing and tabs, and also allows styling. ([Source] - **Name:** core/preformatted - **Category:** text -- **Supports:** anchor, color (background, gradients, text), spacing (padding), typography (fontSize, lineHeight) +- **Supports:** anchor, color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight) - **Attributes:** content ## Pullquote diff --git a/packages/block-library/src/preformatted/block.json b/packages/block-library/src/preformatted/block.json index 32068d4ea1458e..73832f13d3f2ed 100644 --- a/packages/block-library/src/preformatted/block.json +++ b/packages/block-library/src/preformatted/block.json @@ -26,7 +26,8 @@ } }, "spacing": { - "padding": true + "padding": true, + "margin": true }, "typography": { "fontSize": true, diff --git a/packages/block-library/src/preformatted/style.scss b/packages/block-library/src/preformatted/style.scss index 36d90b3152018b..783fee74d4f4fa 100644 --- a/packages/block-library/src/preformatted/style.scss +++ b/packages/block-library/src/preformatted/style.scss @@ -3,3 +3,8 @@ box-sizing: border-box; white-space: pre-wrap; } + +// Add low specificity default padding when a background is used. +:where(.wp-block-preformatted.has-background) { + padding: $block-bg-padding--v $block-bg-padding--h; +} diff --git a/packages/block-library/src/preformatted/theme.scss b/packages/block-library/src/preformatted/theme.scss deleted file mode 100644 index 643a7f5a6d7f17..00000000000000 --- a/packages/block-library/src/preformatted/theme.scss +++ /dev/null @@ -1,4 +0,0 @@ -// Add low specificity default padding when a background is used. -:where(.wp-block-preformatted.has-background) { - padding: $block-bg-padding--v $block-bg-padding--h; -} diff --git a/packages/block-library/src/theme.scss b/packages/block-library/src/theme.scss index 8059aa49596295..1c27a7b0e32c58 100644 --- a/packages/block-library/src/theme.scss +++ b/packages/block-library/src/theme.scss @@ -7,7 +7,6 @@ @import "./quote/theme.scss"; @import "./search/theme.scss"; @import "./group/theme.scss"; -@import "./preformatted/theme.scss"; @import "./separator/theme.scss"; @import "./table/theme.scss"; @import "./video/theme.scss";