Repository navigation
Query Pagination Next: Add border and spacing support - #66394
karthick-murugan wants to merge 3 commits into
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. |
|
👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @karthick-murugan! In case you missed it, we'd love to have you join us in our Slack community. If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information. |
aaronrobertshaw
left a comment
There was a problem hiding this comment.
Thanks for the PR @karthick-murugan 👍
I've taken this for a spin on a local rebase onto trunk, testing borders and padding through Global Styles, a block instance value, and both again at different viewports, with and without enhanced pagination.
✅ Border and Padding work in the editor and on the frontend
✅ A block instance value overrides Global Styles
Before we merge this though I think there are a few things to address. #66393 has the same shape, so these apply there too.
Rebase
docs/reference-guides/core-blocks.md has since moved to docs/reference-guides/core-blocks/README.md. Running npm run docs:build after the rebase will regenerate it and the block's own README.md.
Margin support
- A block instance left margin replaces the
margin-inline-start: autothat positions this link for "Space between", so the Next link jumps to the left edge - A margin set in Global Styles never applies, because the flex layout resets child margins with
.is-layout-flex > :is(*, div) { margin: 0 } - That reset wins over the
:root :where(...)that Global Styles outputs
Padding is ok. The space between pagination links belongs to the container. core/buttons, core/social-links and core/navigation all put blockGap on the parent and keep margin off the children. core/button itself only adopts padding and border.
Query Pagination has no blockGap support yet but I will raise a PR for that separately.
Border controls shown by default
Recent border adoptions like Home Link and Post Navigation Link keep the border controls hidden by default. Setting __experimentalDefaultControls to false here would match them.
Box sizing
It'd be worth adding a style.scss with box-sizing: border-box while you're here, as Comment Edit Link and Post Navigation Link do.
Border screenshots
Padding screenshots
What?
Add border and spacing block support to the Query Pagination Next ( Next Page ) block.
Part of #43247
Part of #43243
Why?
Query Pagination Next ( Next Page )block is missing border and spacing support.How?
Adds the border and spacing block support in block.json
Testing Instructions
Testing Instructions for Keyboard
None
Screenshots or screencast
In Backend:

In Frontend: