aljaz/boris
1
1
Fork 0
mirror of https://github.com/dergigi/boris.git synced 2025-12-18 23:24:22 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(mobile): preserve scroll position when toggling highlights panel

Browse Source 
When opening/closing the highlights sidebar on mobile, the body gets
position:fixed to prevent background scrolling. This was causing the
scroll position to reset to the top.

Now we save the scroll position before locking, apply it as a negative
top value to maintain visual position, and restore it when unlocking.
This commit is contained in:
Gigi
2025-10-23 20:00:16 +02:00
parent e6e7240cd5
commit 13fa6cd485
1 changed files with 10 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/ThreePaneLayout.tsx
View File

@@ -136,13 +136,23 @@ const ThreePaneLayout: React.FC<ThreePaneLayoutProps> = (props) => {
// Lock body scroll when mobile sidebar or highlights is open // Lock body scroll when mobile sidebar or highlights is open
useEffect(() => { useEffect(() => {
if (isMobile && (props.isSidebarOpen || !props.isHighlightsCollapsed)) { if (isMobile && (props.isSidebarOpen || !props.isHighlightsCollapsed)) {
// Save current scroll position
const scrollY = window.scrollY
document.body.style.top = `-${scrollY}px`
document.body.classList.add('mobile-sidebar-open') document.body.classList.add('mobile-sidebar-open')
} else { } else {
// Restore scroll position
const scrollY = document.body.style.top
document.body.classList.remove('mobile-sidebar-open') document.body.classList.remove('mobile-sidebar-open')
document.body.style.top = ''
if (scrollY) {
window.scrollTo(0, parseInt(scrollY || '0') * -1)
}
} }
return () => { return () => {
document.body.classList.remove('mobile-sidebar-open') document.body.classList.remove('mobile-sidebar-open')
document.body.style.top = ''
} }
}, [isMobile, props.isSidebarOpen, props.isHighlightsCollapsed]) }, [isMobile, props.isSidebarOpen, props.isHighlightsCollapsed])