Fix whats news top positioning with system-header

Summary

In the What's new sidebar, the top positioning is not right when there is a system header set.

See #334083 (closed) for a similar issue, although there it happened for another reason.

Steps to reproduce

  1. Add a system header
  2. Open the "What's new" drawer

Example Project

What is the current bug behavior?

The additional 16px from the system header is not respected at the margin-top in .whats-new-drawer and What's new hides partly under the navbar.

What is the expected correct behavior?

Add the additional 16px from the system header to the margin-top in .whats-new-drawer so that What's new no longer hides partly under the navbar.

Relevant logs and/or screenshots

Screenshot_from_2021-07-22_11-39-37

Output of checks

Results of GitLab environment info

Expand for output related to GitLab environment info
(For installations with omnibus-gitlab package run and paste the output of:
`sudo gitlab-rake gitlab:env:info`)

(For installations from source run and paste the output of:
`sudo -u git -H bundle exec rake gitlab:env:info RAILS_ENV=production`)

Results of GitLab application Check

Expand for output related to the GitLab application check

(For installations with omnibus-gitlab package run and paste the output of: sudo gitlab-rake gitlab:check SANITIZE=true)

(For installations from source run and paste the output of: sudo -u git -H bundle exec rake gitlab:check RAILS_ENV=production SANITIZE=true)

(we will only investigate if the tests are passing)

Possible fixes

Add

.with-system-header .whats-new-drawer {
 margin-top: $system-header-height + $header-height;
}

here.