daisyui / react-daisyui

daisyUI components built with React 🌼
http://react.daisyui.com/
MIT License
891 stars 99 forks source link

[4.0.1]: New Modal causes reflow issues #398

Closed exoRift closed 11 months ago

exoRift commented 11 months ago

The new Modal component (this even affects the legacy component as well) blocks scrolling behind the backdrop. However, this also removes the page's scrollbar, causing the page to shift whenever a modal is opened.

benjitrosch commented 11 months ago

@exoRift the modal stopping the user from scrolling is intentional and part of the design system. However, I can't say I've seen what you're describing, can you post an example?

exoRift commented 11 months ago

If you're on a page that's long enough to have a scrollbar, opening a Modal will remove the page's scrollbar, causing a slight shift to the right (because the page fills the scrollbar space)

benjitrosch commented 11 months ago

@exoRift sorry for not responding sooner, thought I had responded already but today I saw the issue was still open.

This isn't an issue with the library but rather the intended behavior. Please see this commit: https://github.com/saadeghi/daisyui/commit/4ba3d4cd2da679a4a24348c4d76afa480b181122

It is possible to override this style from your own CSS if you'd like but it's not an option I'll be introducing to the library.