Query Pagination: Correctly position the "next" link on the first page. #42764
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
scruffian
added
the
[Block] Query Pagination
scruffian
changed the title
|
Size Change: +484 B (0%) Total Size: 1.26 MB
ℹ️ View Unchanged
|
getdave
approved these changes
Jul 28, 2022
ntsekouras
reviewed
Jul 28, 2022
There was a problem hiding this comment.
Thanks for the PR Ben!
I also have an exploratory PR for this: #40851.
|
@getdave good point on the RTL, I pushed a fix for that, using |
ntsekouras
approved these changes
Jul 28, 2022
|
I just tested a bit and this breaks the layout if we have more blocks... I rushed to 🟢 😄
|
|
Good catch thanks @ntsekouras. I added a margin-inline-end: auto to the previous link so now it works like this:
|
|
Thanks Ben! This seems to work well with the basic 'expected' scenarios:
If we change that order it might break some layouts.. I'll leave the decision to you as a theme dev and we can possibly keep an eye to it.. Another thing I was thinking is if we should restrict somehow Query Pagination to only allow these blocks and only once at most.. Do you think there are cases we need something more? A final thing would be unrelated to this PR about |
I think the block is already limited to only allow these blocks as inner blocks. |
You're right, yes! |
Good point, I've added a commit to restrict this CSS to only apply when the next/previous links are last/first elements. |
|
There is an open issue for restricting the number of times the inner blocks can be added: 42580 |
Oh, thanks for the ping here @ntsekouras — currently the logic that outputs the semantic classnames in |
30 tasks
17 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
This is an alternative to #40553, and #36681 and fixes #34997.
The solution here only covers one case, which is:
In this scenario, the next page link is aligned to the left, which is not good UX:
How?
This PR just adds a
margin-inline-start: autoto the next link in this scenario, so that it moves to the right, like so:This covers the main use case of this block.
Testing Instructions
@WordPress/block-themers