Skip to content

MR review bar potentially hides the "Copy branch name" button

Summary

When the screen is not high enough, the review bar hides the "Copy branch name" button.

Banners_and_Alerts_and_Clean_up_the_Create_Project_UI_experiment___59452____Merge_requests___GitLab_org___GitLab___GitLab

Steps to reproduce

  1. Adjust your browser window height to be lower than 780px
  2. See the button is hidden behind the review bar

What is the current bug behavior?

The review bar overlays the button

What is the expected correct behavior?

The issuable sidebar (container for the buttons on the right hand side) should shrink in size not to overlap with the review bar.

Relevant logs and/or screenshots

copy-branch-name-hidden

Output of checks

This bug happens on GitLab.com

Possible fixes

We've implemented fix for the exact same issue for the file tree on the left !59150 (merged) and #288343 (closed)

@iamphill recommends reducing duplication by adding watcher to the review_bar.vue, which would set a class on body that indicates that the MR review bar is visible. This would allow us to remove most of the new code introduced in !59150 (merged) except for the styling.

We should also change the styling of the issuable sidebar to use CSS calc() and custom properties (#327867 (closed)).

/cc @andr3

Edited by Tomas Vik