Skip to content

Resolve Issue list page size control overlap

What does this MR do and why?

Apply new util classes to make issueables list pagination behave in desired manner. See related issue Issue list page size control overlaps paginatio... (#389569 - closed).

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Viewport width Before After
1000px (lg) gdk.test_3000_groups_gitlab-org_-issues__9 gdk.test_3000_groups_gitlab-org_-issues__8
790px (md) gdk.test_3000_groups_gitlab-org_-_issues gdk.test_3000_groups_gitlab-org_-issues__3
700px (sm) gdk.test_3000_groups_gitlab-org_-issues__1 gdk.test_3000_groups_gitlab-org_-issues__4
400px (xs) gdk.test_3000_groups_gitlab-org_-issues__2 gdk.test_3000_groups_gitlab-org_-issues__6

How to set up and validate locally

  1. Check out this branch locally
  2. Navigate to http://gdk.test:3000/groups/gitlab-org/-/issues
  3. Resize the window so that it is smaller than our md breakpoint
  4. You will see that the pagination now behaves the same as the pagination at the bottom of https://gitlab.com/gitlab-org/gitlab/-/security/vulnerability_report in small viewports

Related to #389569 (closed), #425467 (closed)

Edited by Chad Lavimoniere

Merge request reports