fix z-index issues #22416

[abder]

Description

This commit fixes the issue described in #22416

How has this been tested?

Manually on the browser

Screenshots

This commit fixes the following 2 issues
1- The block toolbar is appearing on top of the notice

2- on scrolling enough, the block toolbar also appears on top of the top bar

Types of changes

Changed the z-index value for both the notice and the top bar

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR.

[ZebulanStanphill]

This causes the (recently added) parent-selector button to be unusable when the block toolbar is right below the top toolbar on scroll.

#21056 specifically changed the z-indexes so the block toolbar would appear above the top bar. Whether that was a good idea or not is debatable.

So we need to figure out how to make the parent-selector button usable when the block toolbar goes sticky while still keeping the block toolbar at a lower elevation than the top toolbar.

The only solution I can think of is moving the parent-selector button. I know we only just added it, but I'm starting to have second thoughts about its placement.

Perhaps if #22673 is merged, we could move the parent-selector to the position that the movers currently occupy, and have them float to the left of the block toolbar, rather than above. However, one of the reasons for moving the movers in the first place is to make the block toolbar positioning logic simpler. Moving the parent-selector button there would undo that. (It also breaks the sort of vague "going up the hierarchy" metaphor that the current position of the parent-selector button conveys, though I'm not sure most people would even notice that design detail.) But at least in the short-term, it seems like the best option that doesn't drastically alter the presentation of the button.

Maybe the parent-selector button would make more sense as an item in the "More options" ellipsis menu. On the other hand, that makes it a bit more cumbersome to use, as well as less discoverable. But that does seem like the least-weird place to put it.

Anyone else got any ideas?

[abder]

@ZebulanStanphill I didn't notice that button until now.
if #22673 is merged, i think your idea of moving that button to the previous position of the movers button would be great despite the fact that the new position won't have that context of "going up hierarchy" as you said. looks good with the sticky position too.

[skorasaurus]

Thanks for making this Pull Request and the effort and time you spent on it.

This issue at #22416 appears to have been resolved; so I'm closing the PR.