Correct dimensions for fixed container in the new UI

What does this MR do and why?

This is a follow up on !207643 (closed).

This MR applies correct dimensions for the fixed container (panel) in the new UI.

Be default the original viewport (window) subtracts the scrollbar width, so if you apply right: 0 it will put the element right next to the page's scrollbar. Since the new UI now has panels as their main viewport we have to apply the same logic, otherwise if you do right: 0 the element with a fixed position will cover the scrollbar.

The fixed container is now reduced by the scrollbar width, similar to how the original viewport works. This fixed container is used by some sticky elements to apply the background that spans across the whole viewport.

This change fixes:

  1. Jobs page, which had scrollbars completely hidden
  2. Issue board page (minor fixes)
  3. Sticky elements covering scrollbar

Screenshots or screen recordings

Page Before After
Merge request image image
Issue list image image
Job view image image
Issue board image image

How to set up and validate locally

  1. Enable paneled_view feature flag and enable the new UI
  2. Visit issues list
  3. Click on any issue link
  4. Observe secondary panel to have proper layout, including scrollbar position and visibility
  5. Check the scrollbar visibility on any job view page and any issue board page

Merge request reports

Loading