diff --git a/packages/block-library/src/columns/style.scss b/packages/block-library/src/columns/style.scss index f7e73c81ea794c..07b55900289339 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 index 9d3aa1c6ff59c7..b80d986cacd723 100644 --- a/packages/block-library/src/heading/style.scss +++ b/packages/block-library/src/heading/style.scss @@ -4,9 +4,6 @@ h3, h4, h5, h6 { - &.has-background { - padding: $block-bg-padding--v $block-bg-padding--h; - } &.has-text-align-right[style*="writing-mode"]:where([style*="vertical-rl"]), &.has-text-align-left[style*="writing-mode"]:where([style*="vertical-lr"]) { rotate: 180deg; 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 34960bdb2fd589..1c07eab8786732 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/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 790e09535f4b69..fe64bc80883f2a 100644 --- a/packages/block-library/src/style.scss +++ b/packages/block-library/src/style.scss @@ -17,7 +17,6 @@ @import "./form-input/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";