Skip to content

Update header-height SCSS variable to CSS custom property

What does this MR do and why?

Swap to a no-header default where the default value for --header-height is 0px. This matches other conditionally rendered content like system-header/footer and performance bar in common.scss.

When a header is visible (logged out or not using new navigation show_super_sidebar?) --header-height is 48px and adds padding-top to .layout-page to compensate for fixed header.

Changes

  • Move --header-height reset for new navigation to common.scss with with-header helper class on layout-page in application_helper.rb
  • Remove unused $environment-logs-* SCSS variables

Screenshots or screen recordings

Before After
127.0.0.1_3000_-users_terms_redirect__2F__5 127.0.0.1_3000_-users_terms_redirect__2F__4

How to set up and validate locally

  1. Review terms pages, there should only be 16px of padding at the top to match the bottom
  2. Other pages/views should not be effected by this change
    1. Review pages with new navigation
    2. Review pages with old navigation
    3. Review logged out header which should still have a height of 72px

To view terms page:

  1. Login as an admin (root user in GDK).
  2. Navigate to /admin/application_settings/general
  3. In the Terms of Service and Privacy Policy panel:
    1. Check the All users must accept the Terms of Service and Privacy Policy to access GitLab checkbox
    2. Enter some text in the text area
    3. Save the form
  4. Navigate to /admin/users and choose a user.
  5. Click Impersonate in the upper right corner.

MR acceptance checklist

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

Related to #422602 (closed)

Edited by Scott de Jonge

Merge request reports