Browse Source

fix: ensure titlebar appears when scrolling to top on mobile

imwald
codytseng 1 year ago
parent
commit
49a9824034
  1. 9
      src/renderer/src/layouts/PrimaryPageLayout/index.tsx
  2. 11
      src/renderer/src/layouts/SecondaryPageLayout/index.tsx

9
src/renderer/src/layouts/PrimaryPageLayout/index.tsx

@ -32,13 +32,18 @@ const PrimaryPageLayout = forwardRef(({ children }: { children?: React.ReactNode
const handleScroll = () => { const handleScroll = () => {
const scrollTop = scrollAreaRef.current?.scrollTop || 0 const scrollTop = scrollAreaRef.current?.scrollTop || 0
const diff = scrollTop - lastScrollTop const diff = scrollTop - lastScrollTop
if (scrollTop <= 100) {
setVisible(true)
setLastScrollTop(scrollTop)
return
}
if (diff > 50) { if (diff > 50) {
setVisible(false) setVisible(false)
setLastScrollTop(scrollTop)
} else if (diff < -50) { } else if (diff < -50) {
setVisible(true) setVisible(true)
setLastScrollTop(scrollTop)
} }
setLastScrollTop(scrollTop)
} }
const scrollArea = scrollAreaRef.current const scrollArea = scrollAreaRef.current

11
src/renderer/src/layouts/SecondaryPageLayout/index.tsx

@ -26,9 +26,16 @@ export default function SecondaryPageLayout({
useEffect(() => { useEffect(() => {
const handleScroll = () => { const handleScroll = () => {
const scrollTop = scrollAreaRef.current?.scrollTop || 0 const scrollTop = scrollAreaRef.current?.scrollTop || 0
if (scrollTop > lastScrollTop) { const diff = scrollTop - lastScrollTop
if (scrollTop <= 100) {
setVisible(true)
setLastScrollTop(scrollTop)
return
}
if (diff > 50) {
setVisible(false) setVisible(false)
} else { } else if (diff < -50) {
setVisible(true) setVisible(true)
} }
setLastScrollTop(scrollTop) setLastScrollTop(scrollTop)

Loading…
Cancel
Save