Update position to fixed and zIndex to maximum value #121
Conversation
✅ Deploy Preview for dev-authsdk-ref-guide ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
✅ Deploy Preview for authsdk-ref-guide ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
shrinathprabhu
requested review from
makylfang,
ajithranka and
karthik-durai
src/styles.ts
Outdated
| // Size and position values are set in iframewrapper.ts | ||
|
|
||
| display: 'flex', | ||
| flexDirection: 'column', | ||
| boxShadow: '4px 5px 4px rgba(0, 0, 0, 0.25)', | ||
| borderRadius: '10px', | ||
|
|
||
| zIndex: '214748363', |
There was a problem hiding this comment.
how did you find this is the max value of z-index?
There was a problem hiding this comment.
I googled it. It displays ±2147483647
There was a problem hiding this comment.
Legend has it that the actual max z-index value is 2147483647.
Let's not go crazy with this though. The max value may change between different browsers and is not guaranteed. There's also the possibility of overflow if the number is larger than the actual max putting the element behind others in the stacking context.
May be safer to use a number like 100000 that's large enough for ensure the wallet stays on the top but small enough to avoid overflow. If someone's using z-indexes higher than these in their app, they'll need to override the wallet styles.
shrinathprabhu
deleted the
shrinath/hotfix-wallet-position-and-zindex
branch
Describe your changes
absolutetofixedso wallet doesn't move on scrollScreencasts
Before
Screencast.from.2022-11-15.17-22-19.webm
After
Screencast.from.2022-11-15.17-22-35.webm
Checklist before requesting a review