Skip to content

Moves the Performance Bar to the top instead of being at the bottom

username-removed-128633 requested to merge 34870-move-performance-bar-to-top into master

EE MR: gitlab-org/gitlab-ee!2472

What does this MR do?

This moves the Performance Bar to the top instead of being at the bottom.

Are there points in the code the reviewer needs to double check?

This was challenging since there are a few elements that are moved top of the nav bar height: these ones needed to be moved top of the nav bar height + the perf bar height. I've done it by adding a .with-performance-bar class to the <html> element.

I've also taken the opportunity to:

  • replace some hardcoded 50px with $header-height (6776f0edc6)
  • truncate hostname (afc81e2f3b) shown in the Performance Bar, this fixes #35019 (closed).
  • improve the class helpers a bit (87387536)

Why was this MR needed?

Because the Performance Bar at the bottom is not really practical and doesn't play well with infinite scrolling pages (#34870 (closed)).

Screenshots

With old navigation

performance-bar-old-nav

With new navigation

performance-bar-new-nav

Does this MR meet the acceptance criteria?

What are the relevant issue numbers?

Closes #34870 (closed), #35019 (closed).

Edited by username-removed-128633

Merge request reports