HealthCatalyst / Fabric.Cashmere

Health Catalyst’s comprehensive design system.
http://cashmere.healthcatalyst.net
Apache License 2.0
66 stars 76 forks source link

Modal z-index increases #1426

Closed jacquie closed 4 years ago

jacquie commented 4 years ago

Since we switched to Cashmere modals we have noticed that occasionally we'll have z-index issues with modals where dropdowns in the modal have ended up hidden behind it.

Some sleuthing by Nick into modal.service revealed that there is this on line 133: this._zIndexCounter += 2;

As a consequence modals start with a z-index of 2000 and then it increases by two every time you open a modal. Our dropdown has a z-index of 2500 so as soon as you've opened the modal 250 or so times the dropdown hides behind the modal.

We are wondering if this incrementing is necessary as we can only have one modal open at a time - or if it serves some other purpose?

andrew-frueh commented 4 years ago

Wow! Great find @jacquie and Nick - that's definitely an issue. Strictly speaking, it is possible to open multiple modals if you set the allowMultiple property to true. It's highly discouraged, but it is possible. So the incrementing probably isn't entirely wrong, it just needs to be reset as modals are closed - not increase forever.

Modal Service docs: https://cashmere.healthcatalyst.net/components/modal/api

benjanderson commented 4 years ago

:tada: This issue has been resolved in version 8.1.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket: