Skip to content

Fixed overflowing layout on the compare revisions page

Marco Zille requested to merge gitlab-community/gitlab:zillemarco-fix-compare-revisions-layout into master
  • Please check this box if this contribution uses AI-generated content (including content generated by GitLab Duo features) as outlined in the GitLab DCO & CLA

What does this MR do and why?

When the project path or the branch names were long enough, the selectors for the source and target branch on the compare revisions page were overflowing the page.

This MR fixes that 🙂

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

Screenshots are required for UI changes, and strongly recommended for all other merge requests.

Before After
image image
image image

Video with latest changes:

Recording_fix

Screenshots for the dropdowns with latest changes:

Mobile Desktop
image image

How to set up and validate locally

  1. Go to Code -> Compare revisions page on a project
  2. Either you already have a long enough name or inspect the page and edit the name of the target or source project or branch name
  3. On master it will overflow
  4. On this branch it won't overflow
Edited by Marco Zille

Merge request reports