Z-Index Issues

[dipiana]

I wanted to use shepherd.js on a site with a theme which uses z-index: 9999 for an element I wanted to highlight. That caused some problems with the overlay.

I now tried to set tippyOptions: {zIndex: '99999'} which changes the z-index of the popup.
The z-index of the overlay was not affected.

Therefore I had to change this line:

shepherd/src/js/components/shepherd-modal/styles.js

Line 14 in dbb5578

zIndex: 9997,

after the change, it worked fine.

Is there a way to set the general "base-"z-index?

For example, it would be great to set z-index for the element furthest in the background (in this case they SVG overlay) and increase the z-index for the elements in front of that +1 (the popup) automatically, if not otherwise stated.
We could so always state a "safe" z-index and shepherd never sets a z-index lower than this given number.

[RobbieTheWagner]

Why does the base site set such a high z-index?

We should definitely tie the z-index variables together. Should be a super easy change.