Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add oldest/newest links to shared pagination - with gap between "newer" and "older" #4729

Draft
wants to merge 7 commits into
base: master
Choose a base branch
from

Conversation

AntonKhorev
Copy link
Collaborator

#4710 + #4707 + all borders rounded. With this rounding the buttons won't be able to collapse into one block, there will always be a gap between "newer" and "older".

image
image
image

@AntonKhorev AntonKhorev changed the title Pagination newest oldest split Add oldest/newest links to shared pagination - with gap between "newer" and "older" Apr 27, 2024
@tordans
Copy link
Contributor

tordans commented Apr 27, 2024

From a UX point of view I suggest to only show one of the action (next or last) as full text in the full width UI. We should decide which is more important and make the other option a icon+tooltip only UI. This will declutter the UI a lot and give users a clear focus on the primary action.

It will also reduce the need to split the actions in two groups. There is a reason most UI library show them as a group. It reduces clutter in the UI, makes it easy to understand the actions as relation and reduces the distance the mouse has to move to click back and forth.


I am assuming the screenshots are taken from a page in the middle of the list. On the first and last page the buttons should be inactive or even hidden (inactive is the better choice most of the time).

@AntonKhorev
Copy link
Collaborator Author

It will also reduce the need to split the actions in two groups.

No, it won't because I did it for a different reason. I did it to avoid having four small buttons next to each other on small screens. That would invite tapping a wrong button. There's another way to split them though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants