Start z-index for overlays

Question

We're doing some testing on AEM 6.3 SP2, and I stumbled on an issue in one of our screens.

To edit a component we open a modal foundation form which gets opened in a coral-dialog overlay. In that modal menu we have a foundation datepicker component which opens in a coral-popover.

The issue is the datepicker appears behind the modal menu, because the coral-dialog has a z-index of 10010 and the coral-popover has a z-index of 1480.

Diving into the Coral UI 2 javascript I noticed the start z-index for overlays is 10000.

Isn't that a bit high? I thought we usually take numbers in the order of a 1000 for the overlays' z-index, and only moving components get a z-index in the order of 10000. For example the tooltips have a z-index of 1500.

Or is there something else I'm missing?

arunpatidar · Accepted Answer

Hi,Could you please try to use coral3 datepicker?granite/ui/components/coral/foundation/form/datepicker This works perfectlyThanskArun

JoniVanderheijd · Answer

Thanks,

This replaced the popover container with a coral3-Popover which handles his layering better. It had a z-index of 10020.

This was actually the first thing I tried, but didn't seem to work. I was probably still hitting an old version of the component.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded