Secure z-indexes

[Reinmar]

Right now sticky panel has z-index:999 and the ctx balloon has also 999. I think that they are correctly displayed (ctx balloon over sticky panel) because they are in the right order in the DOM.

IMO, z-indexes should differ here.

[Reinmar]

Related to https://github.com/ckeditor/ckeditor5-ui/issues/218

[oleq]

I think "Solution 2" in #5352 is the right thing to do.

[Reinmar]

Solution 2 is not a solution to this issue (I mean – not directly). Here we should make sure that different UI elements have different z-indexes. So "Solution 2" must be applied together with a rule that different classes are used.

[oleq]

Yes, that's what I meant.

[Reinmar]

Is it done or will be done in this iteration? If not, please move it to it15.

[oleq]

WDYT @dkonopka? What impact would this have on Letters?

[dkonopka]

I'm not so sure because in Letters I've never met similar problem related to same z-index of UI elements. Like in v5, we are using own CSS variables:

:root {
    --ltrs-z-under: -1;
    --ltrs-z-default: 1;
    --ltrs-z-float: 99;
    --ltrs-z-air: 999;
    --ltrs-z-cover: 9999;
    --ltrs-z-overall: 9999999;
}

@define-mixin generate-z-classes $prefix {
	.$prefix {
		z-index: var(--$prefix);
	}
}

IMHO we can manage z-indexes in ckeditor5 with more than two current variables.

:root {
    --ck-z-default: 1;
    --ck-z-modal: 999;
}

Or we can use variables based on UI element

:root {
    --ck-z-sticky-panel: 999;
    --ck-z-balloon-panel: calc( var(--ck-z-sticky-panel) + 1)
}

but it's just an idea.

[CKEditorBot]

There has been no activity on this issue for the past year. We've marked it as stale and will close it in 30 days. We understand it may be relevant, so if you're interested in the solution, leave a comment or reaction under this issue.

[CKEditorBot]

We've closed your issue due to inactivity over the last year. We understand that the issue may still be relevant. If so, feel free to open a new one (and link this issue to it).