ui

ui copied to clipboard

This issue is directly related to: https://github.com/radix-ui/primitives/issues/1662 and appears to be caused by the react-remove-scroll dependency.

It would be really helpful if there was a way for shadcn/ui dialog to accept a prop that disabled this extra dependency. I'm open to other solutions but the cost of setting body {position: relative !important;} is really high (since page layout behind the dialog breaks) and the reward is very low.

Could you please share a specific codesandbox example to explore the workaround?

@remainstheday

If you think the page layout breaks due to position: relative !important; on the body element then you can change the styles by using the below code

body[style] {
	position: static !important;
}

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.

Hey @shadcn,

Following up on his issue, for me data-scroll-lock is breaking my layout. Here is the screen capture:

without dialog

with dialog

if I remove the data-scroll-lock from the html tag

Is there a work around where the dialog doesn't remove scroll bar and thus doesn't affect the layout?

Thanks

I am also experiencing the same issue, although this isn't a shadcn-ui issue. If anything it's a radix issue, but really its a react-remove-scroll issue.

Anyone come up with a fix?

Just experienced it, mildly annoying. Anyone know a nice fix yet?