Ensure the top header bar has a stacking context for menus.

Review Request #14426 — Created May 7, 2025 and submitted

Information

Review Board
release-7.1.x

Reviewers

The new actions layout fixes regressed the stacking of menus from the
top header bar. rb-c-actions is now a flexbox, which changed the logic
for stacking contexts, causing menus to appear above other
higher-stacked items (such as the dashboard).

The core problem was that the header area was supposed to have its own
stacking context, but didn't have a suitable position for it. Now it
does, allowing the z-index to apply.

Note that this isn't perfect. Anything with a z-index higher than 50
(the value set for the header) will end up sitting on top of any menus
opened from this header. Due to the way stacking contexts are currently
created, solving this in a broader way ends up being a larger task, one
not tackled in this change.

There is a side effect from this change, in that the logo and other
parts of the branding section end up nudged to the right a few pixels.
We compensate for that by removing the extra left padding on the header.

Tested the Follow menu on the dashboard page. Verified that it appeared
above the dashboard.

Summary ID
Ensure the top header bar has a stacking context for menus.
The new actions layout fixes regressed the stacking of menus from the top header bar. `rb-c-actions` is now a flexbox, which changed the logic for stacking contexts, causing menus to appear above other higher-stacked items (such as the dashboard). The core problem was that the header area was supposed to have its own stacking context, but didn't have a suitable `position` for it. Now it does, allowing the z-index to apply. Note that this isn't perfect. Anything with a `z-index` higher than `50` (the value set for the header) will end up sitting on top of any menus opened from this header. Due to the way stacking contexts are currently created, solving this in a broader way ends up being a larger task, one not tackled in this change.
952f52594af3b7a8280faf81ec1579e9fbe9accd

chipx86
maubin
  1. Ship It!
  2. 
      
david
  1. Ship It!
  2. 
      
chipx86
Review request changed
Status:
Completed
Change Summary:
Pushed to release-7.1.x (ca0b237)