Comments Pagination: Remove unwanted bottom margin from links #70360
Conversation
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
There was a problem hiding this comment.
Thanks for the PR!
The fundamental problem isn't that the block has margins applied by default, but that we can't override the default margins using the global styles. Therefore, simply changing the bottom margin value to 0 doesn't solve this fundamental problem.
I believe the ideal approach is to remove ALL margin styles. See #64874
Note that we need to update editor.scss as well as style.scss.
…ins to let global styles override the block styles
|
Hey @t-hamano, thank you so much for pointing that out! 🙏 I've gone ahead and cleaned up all the margin styles specifically tied to the comments pagination block. Now, the pagination margins are fully controlled via global styles—making it much easier to override and maintain consistency across the site. Your feedback really helped streamline this—appreciate it! Here’s the global style I’ve set for the comments pagination previous link. And here’s how it now reflects on the actual page with the global styles successfully overriding the block-level margins: |
|
Thanks for the update! One last thing, we should be able to remove this |
|
@t-hamano - I've removed margin-right property too !!! Thanks for your feedback. |
|
@vk17-starlord I don't think we can delete |
|
@t-hamano Apologies for accidentally removing font-size: inherit in the earlier commit. I've added it back in the latest update. |
| &.block-editor-block-list__layout { | ||
| margin: 0; | ||
| } |
There was a problem hiding this comment.
Memo: The main purpose of this PR is to remove the default margin from the three child blocks (Comments Next Page, Comments Previous Page, and Comments Page Numbers), but note that this part is related to the parent Comment Pagination block.
Some default themes define margins for the Comment Pagination block, but the zero margin takes precedence, and the styles are not applied correctly:
This PR will allow the editor to correctly apply the margin provided by the theme to the comment pagination block itself as well as the three child blocks.
|
Unfortunately, it seems that recent changes in the core are causing E2E tests to fail. Let's wait until that issue is resolved. |
This is a known issue and is not related to this PR, so let's merge this PR. See https://wordpress.slack.com/archives/C02QB2JS7/p1749712750681339 |
…ess#70360) * fix: remove bottom margin from comments pagination numbers * fix: remove unnecessary blank line in comments pagination styles * fix: clean up comments pagination styles by removing unnecessary margins to let global styles override the block styles * fix: remove unnecessary margin styles from comments pagination component * fix: add missing styles for comments pagination component Co-authored-by: vk17-starlord <vineet2003@git.wordpress.org> Co-authored-by: t-hamano <wildworks@git.wordpress.org> Co-authored-by: cbravobernal <cbravobernal@git.wordpress.org> Co-authored-by: iamtakashi <iamtakashi@git.wordpress.org>
Description
This pull request addresses Issue #62114 by removing the unwanted bottom margin from the Comments Pagination block links (
Comments Next Page,Comments Previous Page, andComments Page Numbers). The default margin created misalignments in themes and could not be easily overridden via Global Styles,theme.json, or custom CSS.What’s changed
.wp-block-comments-paginationcontainer and its direct child link elements.Rationale
How to test
Related