diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index 0b323b38197792..0cda355c0e2a37 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -191,7 +191,7 @@ Displays a paginated navigation to next/previous set of comments, when applicabl - **Name:** core/comments-pagination - **Category:** theme - **Parent:** core/comments -- **Supports:** align, color (background, gradients, link, text), layout (default, ~~allowInheriting~~, ~~allowSwitching~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ +- **Supports:** align, color (background, gradients, link, text), layout (default, ~~allowInheriting~~, ~~allowSwitching~~), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ - **Attributes:** paginationArrow ## Comments Next Page @@ -201,7 +201,7 @@ Displays the next comment's page link. ([Source](https://github.com/WordPress/gu - **Name:** core/comments-pagination-next - **Category:** theme - **Parent:** core/comments-pagination -- **Supports:** color (background, gradients, ~~text~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ +- **Supports:** color (background, gradients, ~~text~~), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ - **Attributes:** label ## Comments Page Numbers @@ -211,7 +211,7 @@ Displays a list of page numbers for comments pagination. ([Source](https://githu - **Name:** core/comments-pagination-numbers - **Category:** theme - **Parent:** core/comments-pagination -- **Supports:** color (background, gradients, ~~text~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ +- **Supports:** color (background, gradients, ~~text~~), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ - **Attributes:** ## Comments Previous Page @@ -221,7 +221,7 @@ Displays the previous comment's page link. ([Source](https://github.com/WordPres - **Name:** core/comments-pagination-previous - **Category:** theme - **Parent:** core/comments-pagination -- **Supports:** color (background, gradients, ~~text~~), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ +- **Supports:** color (background, gradients, ~~text~~), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~, ~~reusable~~ - **Attributes:** label ## Comments Title diff --git a/packages/block-library/src/comments-pagination-next/block.json b/packages/block-library/src/comments-pagination-next/block.json index d619865ebd6f5e..85c2b984078ea1 100644 --- a/packages/block-library/src/comments-pagination-next/block.json +++ b/packages/block-library/src/comments-pagination-next/block.json @@ -23,6 +23,18 @@ "background": true } }, + "spacing": { + "margin": true, + "padding": true + }, + "__experimentalStyle": { + "spacing": { + "margin": { + "right": "0.5em", + "bottom": "0.5em" + } + } + }, "typography": { "fontSize": true, "lineHeight": true, diff --git a/packages/block-library/src/comments-pagination-numbers/block.json b/packages/block-library/src/comments-pagination-numbers/block.json index fcebb52763870e..1e874df2379133 100644 --- a/packages/block-library/src/comments-pagination-numbers/block.json +++ b/packages/block-library/src/comments-pagination-numbers/block.json @@ -11,6 +11,18 @@ "supports": { "reusable": false, "html": false, + "spacing": { + "margin": true, + "padding": true + }, + "__experimentalStyle": { + "spacing": { + "margin": { + "right": "0.5em", + "bottom": "0.5em" + } + } + }, "color": { "gradients": true, "text": false, diff --git a/packages/block-library/src/comments-pagination-previous/block.json b/packages/block-library/src/comments-pagination-previous/block.json index 2dab1e9dd73674..f59653408bb747 100644 --- a/packages/block-library/src/comments-pagination-previous/block.json +++ b/packages/block-library/src/comments-pagination-previous/block.json @@ -23,6 +23,18 @@ "background": true } }, + "spacing": { + "margin": true, + "padding": true + }, + "__experimentalStyle": { + "spacing": { + "margin": { + "right": "0.5em", + "bottom": "0.5em" + } + } + }, "typography": { "fontSize": true, "lineHeight": true, diff --git a/packages/block-library/src/comments-pagination/block.json b/packages/block-library/src/comments-pagination/block.json index a11decd201e94f..4dc263e64a0d41 100644 --- a/packages/block-library/src/comments-pagination/block.json +++ b/packages/block-library/src/comments-pagination/block.json @@ -36,6 +36,10 @@ "type": "flex" } }, + "spacing": { + "margin": true, + "padding": true + }, "typography": { "fontSize": true, "lineHeight": true, diff --git a/packages/block-library/src/comments-pagination/editor.scss b/packages/block-library/src/comments-pagination/editor.scss index dbf7e60ff65c06..629a09f09507b1 100644 --- a/packages/block-library/src/comments-pagination/editor.scss +++ b/packages/block-library/src/comments-pagination/editor.scss @@ -1,5 +1,3 @@ -$pagination-margin: 0.5em; - // Center flex items. This has an equivalent in style.scss. .wp-block[data-align="center"] > .wp-block-comments-pagination { justify-content: center; @@ -8,27 +6,5 @@ $pagination-margin: 0.5em; .editor-styles-wrapper { .wp-block-comments-pagination { max-width: 100%; - &.block-editor-block-list__layout { - margin: 0; - } - } -} - -.wp-block-comments-pagination { - > .wp-block-comments-pagination-next, - > .wp-block-comments-pagination-previous, - > .wp-block-comments-pagination-numbers { - // Override editor auto block margins. - margin-left: 0; - margin-top: $pagination-margin; - - /*rtl:ignore*/ - margin-right: $pagination-margin; - margin-bottom: $pagination-margin; - - &:last-child { - /*rtl:ignore*/ - margin-right: 0; - } } } diff --git a/packages/block-library/src/comments-pagination/style.scss b/packages/block-library/src/comments-pagination/style.scss index c6b5d9a0a29e91..49f80f1577e58f 100644 --- a/packages/block-library/src/comments-pagination/style.scss +++ b/packages/block-library/src/comments-pagination/style.scss @@ -4,10 +4,6 @@ $pagination-margin: 0.5em; > .wp-block-comments-pagination-next, > .wp-block-comments-pagination-previous, > .wp-block-comments-pagination-numbers { - /*rtl:ignore*/ - margin-right: $pagination-margin; - margin-bottom: $pagination-margin; - &:last-child { /*rtl:ignore*/ margin-right: 0;