mmintel/klz-cables.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix(ui): global modal scroll locks and ci branch db seeding
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 13s
Details
Build & Deploy / 🏗️ Build (push) Has been cancelled
Details
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Details
Build & Deploy / 🧪 Post-Deploy Verification (push) Has been cancelled
Details
Build & Deploy / 🔔 Notify (push) Has been cancelled
Details
Build & Deploy / 🧪 QA (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Marc Mintel
2026-03-05 22:54:44 +01:00
parent 663aaefc4f
commit 761c6be80a
6 changed files with 76 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/BrochureModal.tsx
View File

@@ -57,10 +57,12 @@ export default function BrochureModal({ isOpen, onClose }: BrochureModalProps) {
document.addEventListener('keydown', handleKeyDown);
// Strict overflow lock on mobile as well
document.documentElement.style.setProperty('overflow', 'hidden', 'important');
document.body.style.setProperty('overflow', 'hidden', 'important');
return () => {
document.removeEventListener('keydown', handleKeyDown);
document.documentElement.style.overflow = '';
document.body.style.overflow = '';
};
}, [isOpen, onClose]);

4
components/Header.tsx
View File

@@ -36,6 +36,7 @@ export default function Header() {
// Prevent scroll when mobile menu is open and handle focus trap
useEffect(() => {
if (isMobileMenuOpen) {
document.documentElement.style.overflow = 'hidden';
document.body.style.overflow = 'hidden';
// Focus trap logic
const focusableElements = mobileMenuRef.current?.querySelectorAll(
@@ -80,7 +81,8 @@ export default function Header() {
};
}
} else {
document.body.style.overflow = 'unset';
document.documentElement.style.overflow = '';
document.body.style.overflow = '';
}
}, [isMobileMenuOpen]);

10
components/Lightbox.tsx
View File

@@ -125,13 +125,17 @@ export default function Lightbox({ isOpen, images, initialIndex, onClose }: Ligh
};
// Lock scroll
const originalStyle = window.getComputedStyle(document.body).overflow;
document.body.style.overflow = 'hidden';
const originalBodyStyle = window.getComputedStyle(document.body).overflow;
const originalHtmlStyle = window.getComputedStyle(document.documentElement).overflow;
document.documentElement.style.setProperty('overflow', 'hidden', 'important');
document.body.style.setProperty('overflow', 'hidden', 'important');
window.addEventListener('keydown', handleKeyDown);
return () => {
document.body.style.overflow = originalStyle;
document.documentElement.style.overflow = originalHtmlStyle;
document.body.style.overflow = originalBodyStyle;
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, prevImage, nextImage, handleClose]);