ui
ui copied to clipboard
shadcn-ui
shadcn AlertDialog doesn't allow window scrolling
shadcn AlertDialog doesn't allow window scrolling right side when click AlertDialogTrigger
@SOU-code it's not the issue with shadcn-ui but of radix-ui library
but it's happened
@SOU-code
You can fix it by adding the styles to the body
.body {
overflow-y: scroll !important;
}
make sure you add a className of body to the body element
<body className={`${inter.className} body`}>{children}</body>
https://github.com/shadcn-ui/ui/assets/150527559/4a731eaf-1bfc-4451-9829-05679dd197d9
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.
With this script you can prevent added attribute 'data-scroll-locked' in the body and you will prevent the blocked scroll body
<script>
function removeScrollLockedAttribute(mutationsList) {
for (let mutation of mutationsList) {
if (mutation.type === 'attributes' && mutation.attributeName === 'data-scroll-locked') {
document.body.removeAttribute('data-scroll-locked');
}
}
}
const observer = new MutationObserver(removeScrollLockedAttribute);
observer.observe(document.body, { attributes: true });
const preventScrollLock = new Proxy(document.body, {
set: function(target, key, value) {
if (key === 'setAttribute' && value[0] === 'data-scroll-locked') {
return false; // Prevenir que se añada el atributo
}
return Reflect.set(target, key, value);
}
});
document.body.setAttribute = preventScrollLock.setAttribute;
</script>
