Don't mess with parent window scrollbars

[dkent600]

Currently when the modal popup appears, the dApps' scrollbars disappear. The space gained by hiding the scrollbar(s) causes all the dApp's content to shift around. This is messy UX.

Would be cleaner if the popup did not mess with parent window scrollbars.

[miohtama]

Can you pinpoint a necessary CSS change that could fix this?

Can you also show an example where this happens?

Happy to look for a fix.

[dkent600]

Thanks @miohtama!

Examples, from https://alchemy.daostack.io/:

Before modal pops up, see scrollbar:

With modal popped up, no scroll bar:

Everything on the page moves when the scrollbar disappears and reappears. I guess I would play with the styling of the background that appears under the modal.

[pedrouid]

Is this fixed already?

[dkent600]

No, is not fixed.

[pedrouid]

Alright, I will get it on next release

[microHoffman]

@pedrouid @miohtama @dkent600 any news on this? the layout shift is unfortunate:/ thanks for the info

[xzilja]

With stable version 2.0.0 of Web3Modal now released, we are officially dropping support for version 1.x Due to this this issue/pr was marked for closing. It is highly recommended to upgrade as 2.x will be receiving further updates that will enable functionality for some of our newer sdks like auth and push as well as support for WalletConnect v2 (See this post about WalletConnect v1 being deprecated https://medium.com/walletconnect/walletconnect-v1-0-sunset-notice-and-migration-schedule-8af9d3720d2e)

If you need to continue using Web3Modal 1.x and require this feature/fix implemented, we suggest adding it via forking V1 branch.

[Antony-Jia]

I met the same question and make body not scroll but root div scoll it can solve