Admin wrench overlaps notifications menu

(Adam Capriola) #1

Not sure why the z-index of the notifications menu isn’t giving it priority (it’s 1100; the wrench is 1000). Changing the z-index of .show-topic-admin to 999 seems to fix it but I don’t know if that’s all there is to this…

discourse/topic-admin-menu.scss at b12ace5f9d867426172c0fa17e8107b3805e8901 · discourse/discourse · GitHub

(I’m on v1.4.0.beta12 +131 and testing on Chrome + Safari on OSX.)

(Sam Saffron) #2

Recategorized as UX, stacking position of fixed elements is pretty hellish.

Patch welcome, but this stuff ain’t easy.

(Simon Cossar) #3

It seems to be because the menu is a child of the header. The header has a z-index of 1000. The admin wrench also has a z-index of 1000. The admin wrench is in it’s own stacking context because of its fixed position. I’m not sure why the admin-wrench wins - I assume it’s because it comes last in the document.

The z-index of 1100 that is applied to the menu will only come into effect if the menu is overlapping other elements that are within its stacking context.