Skip to content

Fix hidden notifications dropdown on zoomed in screens

Peter Hegman requested to merge 335299-popup-overlapping-important-message into master

What does this MR do and why?

Related to #335299 (closed)

Currently, when zoomed in, the notifications dropdown on the project/group overview page will be displayed above the toggle button. This causes it to be hidden behind the navigation. There isn't room for these dropdowns to be shown above the toggle button so we should always shown them below.

This MR passes the noFlip prop to GlDropdown so the dropdown is always shown below the toggle button.

Screenshots or screen recordings

Project

Before After
Screen_Shot_2022-01-27_at_9.44.51_AM Screen_Shot_2022-01-27_at_9.42.19_AM

Group

Before After
Screen_Shot_2022-01-27_at_9.44.10_AM Screen_Shot_2022-01-27_at_9.43.06_AM

User notifications

Unchanged, we want these dropdowns to be able to flip since there is enough room at the top and not enough room at the bottom

Before After
Screen_Shot_2022-01-27_at_9.45.35_AM Screen_Shot_2022-01-27_at_9.48.24_AM

How to set up and validate locally

  1. In Safari navigate to a project or group
  2. Zoom in as far as you can ⌘ +
  3. Open the notifications dropdown

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Peter Hegman

Merge request reports