Is your feature request related to a problem?
The headless UI is doing all sorts of stuff to my page when I open a modal, such as adding 15px padding to the body's right side and disabling scroll. I don't want this; I can use modern CSS such as "scrollbarGutter: 'stable'" or simply allow scrolling all the time - that should be my choice.
Describe the solution you'd like
Please allow for disabling this. I don't think that disableBodyScroll should be called at all for the headless version of this library, but it should be possible to specify that it doesn't get called or control the reserveScrollBarGap parameter.
I think for the headless UI, it would be much better to simply apply a class to the Body element of the page i.e. modal-open, and allow the developer using this package to supply their own css.
Describe alternatives you've considered
My current workaround is to just use !important css rules to disable changes being made. Not ideal but works.
Additional context
|
disableBodyScroll(modal, { reserveScrollBarGap: true }); |
Is your feature request related to a problem?
The headless UI is doing all sorts of stuff to my page when I open a modal, such as adding 15px padding to the body's right side and disabling scroll. I don't want this; I can use modern CSS such as "scrollbarGutter: 'stable'" or simply allow scrolling all the time - that should be my choice.
Describe the solution you'd like
Please allow for disabling this. I don't think that disableBodyScroll should be called at all for the headless version of this library, but it should be possible to specify that it doesn't get called or control the reserveScrollBarGap parameter.
I think for the headless UI, it would be much better to simply apply a class to the Body element of the page i.e. modal-open, and allow the developer using this package to supply their own css.
Describe alternatives you've considered
My current workaround is to just use !important css rules to disable changes being made. Not ideal but works.
Additional context
qwik-ui/packages/kit-headless/src/components/modal/use-modal.tsx
Line 82 in 3fda36b