Skip to content

Create merge request button extends past edge on mobile

Summary

The 'Select project to create merge request' button extends past the right edge on small screens, pushing the avatar and the navbar toggle off the edge

Proposal

The button should appear on a new line below the heading, both of which should extend the full width of their container. I think this could be achieved with some additional flexbox utilities being added to app/views/dashboard/merge_requests.html.haml

Steps to reproduce

  • Login to gitlab on a phone / set browser viewport to < 480px
  • On the top nav bar, click the 3 dots to reveal issues, merge requests and todos counts
  • Click merge requests

What is the current bug behavior?

  • The button's width extends it over the edge of its container
  • Avatar and navbar cant be accessed unless you scroll sideways

What is the expected correct behavior?

  • The button should flow below the title and both should take up the full width of the container
  • The avatar and navbar should not get pushed off the side of the page

Relevant logs and/or screenshots

2019-02-01_08.33.36

Output of checks

This bug happens on GitLab.com

Edited by Peter Hegman