Make sure MR sticky header is accessible when browser font size=large

Chad Lavimoniererequested to merge
433547-mr-title-overlaps-top-navbar-when-chrome-text-size-is-large into master

What does this MR do and why?

Currently we use a fixed pixel value for the MR sticky header height, but this should acutally use a rem value to adjust with browser font size settings.

References

Please include cross links to any resources that are relevant to this MR. This will give reviewers and future readers helpful context to give an efficient review of the changes introduced.

Screenshots or screen recordings

Before After
Screen_Recording_2025-01-08_at_14.58.53 Screen_Recording_2025-01-08_at_14.58.34

How to set up and validate locally

  1. Check out this branch
  2. In Chrome (or a Chromium browser like Arc), go to Settings > Appearance and set the font size to large
  3. Visit an MR in the GDK
  4. Scroll down so that the sticky header appears

You will see that the content of the sticky header is not cut off by the app bar

Merge request reports