From 558c3775ab06950231b7902ae951be13359c24e3 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Sat, 20 May 2023 13:50:13 +0200 Subject: [PATCH 1/3] Move CSS that adds padding when there is a background color --- packages/block-library/src/columns/style.scss | 7 ------- packages/block-library/src/columns/theme.scss | 5 +++++ packages/block-library/src/heading/style.scss | 10 ---------- packages/block-library/src/heading/theme.scss | 10 ++++++++++ packages/block-library/src/list/style.scss | 4 ---- packages/block-library/src/list/theme.scss | 6 ++++++ packages/block-library/src/paragraph/style.scss | 4 ---- packages/block-library/src/paragraph/theme.scss | 4 ++++ packages/block-library/src/preformatted/style.scss | 4 ---- packages/block-library/src/preformatted/theme.scss | 5 +++++ packages/block-library/src/style.scss | 1 - packages/block-library/src/theme.scss | 5 +++++ 12 files changed, 35 insertions(+), 30 deletions(-) create mode 100644 packages/block-library/src/columns/theme.scss delete mode 100644 packages/block-library/src/heading/style.scss create mode 100644 packages/block-library/src/heading/theme.scss create mode 100644 packages/block-library/src/list/theme.scss create mode 100644 packages/block-library/src/paragraph/theme.scss create mode 100644 packages/block-library/src/preformatted/theme.scss diff --git a/packages/block-library/src/columns/style.scss b/packages/block-library/src/columns/style.scss index 96fbf26009a4ab..db8e406c76eb0f 100644 --- a/packages/block-library/src/columns/style.scss +++ b/packages/block-library/src/columns/style.scss @@ -77,13 +77,6 @@ margin-bottom: 1.75em; } -// Add low specificity default padding to columns blocks with backgrounds. -:where(.wp-block-columns.has-background) { - // Matches paragraph block padding. - padding: $block-bg-padding--v $block-bg-padding--h; -} - - .wp-block-column { flex-grow: 1; diff --git a/packages/block-library/src/columns/theme.scss b/packages/block-library/src/columns/theme.scss new file mode 100644 index 00000000000000..8c7cc1da5ba2aa --- /dev/null +++ b/packages/block-library/src/columns/theme.scss @@ -0,0 +1,5 @@ +// Add low specificity default padding to columns blocks with backgrounds. +:where(.wp-block-columns.has-background) { + // Matches paragraph block padding. + padding: $block-bg-padding--v $block-bg-padding--h; +} diff --git a/packages/block-library/src/heading/style.scss b/packages/block-library/src/heading/style.scss deleted file mode 100644 index 31a6989c39c817..00000000000000 --- a/packages/block-library/src/heading/style.scss +++ /dev/null @@ -1,10 +0,0 @@ -h1, -h2, -h3, -h4, -h5, -h6 { - &.has-background { - padding: $block-bg-padding--v $block-bg-padding--h; - } -} diff --git a/packages/block-library/src/heading/theme.scss b/packages/block-library/src/heading/theme.scss new file mode 100644 index 00000000000000..beffc6e1dd0e20 --- /dev/null +++ b/packages/block-library/src/heading/theme.scss @@ -0,0 +1,10 @@ +// Add low specificity default padding to headings with backgrounds. +:where(h1.has-background), +:where(h2.has-background), +:where(h3.has-background), +:where(h4.has-background), +:where(h5.has-background), +:where(h6.has-background) { + // Matches paragraph block padding. + padding: $block-bg-padding--v $block-bg-padding--h; +} diff --git a/packages/block-library/src/list/style.scss b/packages/block-library/src/list/style.scss index badf1b9e560ebd..e15d683006e714 100644 --- a/packages/block-library/src/list/style.scss +++ b/packages/block-library/src/list/style.scss @@ -1,8 +1,4 @@ ol, ul { box-sizing: border-box; - - &.has-background { - padding: $block-bg-padding--v $block-bg-padding--h; - } } diff --git a/packages/block-library/src/list/theme.scss b/packages/block-library/src/list/theme.scss new file mode 100644 index 00000000000000..73f7743c6c631d --- /dev/null +++ b/packages/block-library/src/list/theme.scss @@ -0,0 +1,6 @@ +// Add low specificity default padding to lists with backgrounds. +:where(ol.has-background), +:where(ul.has-background) { + // Matches paragraph block padding. + padding: $block-bg-padding--v $block-bg-padding--h; +} diff --git a/packages/block-library/src/paragraph/style.scss b/packages/block-library/src/paragraph/style.scss index f3bb9f8c5aee86..fc0441f3d3d344 100644 --- a/packages/block-library/src/paragraph/style.scss +++ b/packages/block-library/src/paragraph/style.scss @@ -38,10 +38,6 @@ p.has-drop-cap.has-background { overflow: hidden; } -p.has-background { - padding: $block-bg-padding--v $block-bg-padding--h; -} - // Use :where to contain the specificity of this rule // so it's easily overrideable by any theme that targets // links using the a element. diff --git a/packages/block-library/src/paragraph/theme.scss b/packages/block-library/src/paragraph/theme.scss new file mode 100644 index 00000000000000..a917e377fc02f9 --- /dev/null +++ b/packages/block-library/src/paragraph/theme.scss @@ -0,0 +1,4 @@ +// Add low specificity default padding to paragraphs with backgrounds. +:where(p.has-background) { + padding: $block-bg-padding--v $block-bg-padding--h; +} diff --git a/packages/block-library/src/preformatted/style.scss b/packages/block-library/src/preformatted/style.scss index 71e60ffe4ea529..d9309db9cf4a4e 100644 --- a/packages/block-library/src/preformatted/style.scss +++ b/packages/block-library/src/preformatted/style.scss @@ -1,7 +1,3 @@ .wp-block-preformatted { 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..4efb564d6498c4 --- /dev/null +++ b/packages/block-library/src/preformatted/theme.scss @@ -0,0 +1,5 @@ +// Add low specificity default padding to preformatted blocks with backgrounds. +:where(.wp-block-preformatted.has-background) { + // Matches paragraph block padding. + padding: $block-bg-padding--v $block-bg-padding--h; +} diff --git a/packages/block-library/src/style.scss b/packages/block-library/src/style.scss index 8fe8b904c23f58..e6b433dcecc438 100644 --- a/packages/block-library/src/style.scss +++ b/packages/block-library/src/style.scss @@ -16,7 +16,6 @@ @import "./file/style.scss"; @import "./gallery/style.scss"; @import "./group/style.scss"; -@import "./heading/style.scss"; @import "./image/style.scss"; @import "./latest-comments/style.scss"; @import "./latest-posts/style.scss"; diff --git a/packages/block-library/src/theme.scss b/packages/block-library/src/theme.scss index 1c27a7b0e32c58..dcaff4b0cb49dc 100644 --- a/packages/block-library/src/theme.scss +++ b/packages/block-library/src/theme.scss @@ -1,8 +1,13 @@ @import "./audio/theme.scss"; @import "./code/theme.scss"; +@import "./columns/theme.scss"; @import "./embed/theme.scss"; @import "./gallery/theme.scss"; +@import "./heading/theme.scss"; @import "./image/theme.scss"; +@import "./list/theme.scss"; +@import "./paragraph/theme.scss"; +@import "./preformatted/theme.scss"; @import "./pullquote/theme.scss"; @import "./quote/theme.scss"; @import "./search/theme.scss"; From 66f8cc23e7f85cceb701492f61329a99479f7976 Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Wed, 3 Jan 2024 05:43:51 +0100 Subject: [PATCH 2/3] Try to solve merge conflict with heading/style.scss. --- packages/block-library/src/heading/style.scss | 11 +++++++++++ 1 file changed, 11 insertions(+) create mode 100644 packages/block-library/src/heading/style.scss diff --git a/packages/block-library/src/heading/style.scss b/packages/block-library/src/heading/style.scss new file mode 100644 index 00000000000000..b80d986cacd723 --- /dev/null +++ b/packages/block-library/src/heading/style.scss @@ -0,0 +1,11 @@ +h1, +h2, +h3, +h4, +h5, +h6 { + &.has-text-align-right[style*="writing-mode"]:where([style*="vertical-rl"]), + &.has-text-align-left[style*="writing-mode"]:where([style*="vertical-lr"]) { + rotate: 180deg; + } +} From 40932804e515ddb5462fac3204025903dc0edceb Mon Sep 17 00:00:00 2001 From: Carolina Nymark Date: Fri, 8 Mar 2024 06:50:36 +0100 Subject: [PATCH 3/3] Remove duplicate CSS in heading/style.scss after updating from trunk. --- packages/block-library/src/heading/style.scss | 4 ---- 1 file changed, 4 deletions(-) diff --git a/packages/block-library/src/heading/style.scss b/packages/block-library/src/heading/style.scss index 502f6cfefd73e0..b80d986cacd723 100644 --- a/packages/block-library/src/heading/style.scss +++ b/packages/block-library/src/heading/style.scss @@ -8,8 +8,4 @@ h6 { &.has-text-align-left[style*="writing-mode"]:where([style*="vertical-lr"]) { rotate: 180deg; } - &.has-text-align-right[style*="writing-mode"]:where([style*="vertical-rl"]), - &.has-text-align-left[style*="writing-mode"]:where([style*="vertical-lr"]) { - rotate: 180deg; - } }