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

Make pagination responsive by default #1894

Merged
merged 6 commits into from
Jan 20, 2022
Merged

Make pagination responsive by default #1894

merged 6 commits into from
Jan 20, 2022

Conversation

simurai
Copy link
Contributor

@simurai simurai commented Jan 19, 2022

What are you trying to accomplish?

This closes https://github.com/github/primer/issues/537 by making the pagination component responsive by default.

What approach did you choose and why?

It uses the breakpoints to only show certain parts when the viewport is wide enough.

0 -> sm sm -> md md -> or wider
image image image
Only shows [Previous] and [Next] Also shows [current number] and [...] Shows everything

What should reviewers focus on?

The responsive styles added here have been in production for 1-2 years. It's currently scoped to .page-responsive but I think it should be safe to make it responsive by default everywhere since most pages are responsive.

Are additional changes needed?

  • ⚠️ Yes, once this ships to dotcom we can remove these styles again.

@changeset-bot
Copy link

changeset-bot bot commented Jan 19, 2022

🦋 Changeset detected

Latest commit: d504b68

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/css Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

This was overridden before with the `.page-responsive .pagination` selector
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants