Browse Source

fix toc scroll button

imwald
Silberengel 3 months ago
parent
commit
447a306059
  1. 2
      package.json
  2. 32
      src/components/Note/PublicationIndex/PublicationIndex.tsx

2
package.json

@ -1,6 +1,6 @@
{ {
"name": "jumble-imwald", "name": "jumble-imwald",
"version": "16.1.0", "version": "16.1.1",
"description": "A user-friendly Nostr client focused on relay feed browsing and relay discovery, forked from Jumble", "description": "A user-friendly Nostr client focused on relay feed browsing and relay discovery, forked from Jumble",
"private": true, "private": true,
"type": "module", "type": "module",

32
src/components/Note/PublicationIndex/PublicationIndex.tsx

@ -383,15 +383,35 @@ export default function PublicationIndex({
return toc return toc
}, [references, formatBookstrTitle]) }, [references, formatBookstrTitle])
// Scroll to ToC // Scroll to ToC (scroll to top of page)
const scrollToToc = useCallback(() => { const scrollToToc = useCallback(() => {
// Find the scrollable container (could be window or a drawer/scrollable div)
let scrollContainer: HTMLElement | Window = window
const tocElement = document.getElementById('publication-toc') const tocElement = document.getElementById('publication-toc')
if (tocElement) { if (tocElement) {
const rect = tocElement.getBoundingClientRect() // Walk up the DOM tree to find the scrollable container
const elementTop = rect.top + window.scrollY let element = tocElement.parentElement
const offset = 96 while (element && element !== document.body) {
const scrollPosition = Math.max(0, elementTop - offset) const style = window.getComputedStyle(element)
window.scrollTo({ top: scrollPosition, behavior: 'smooth' }) const overflowY = style.overflowY
// Check if this element is scrollable
if (overflowY === 'auto' || overflowY === 'scroll' || overflowY === 'overlay') {
if (element.scrollHeight > element.clientHeight) {
scrollContainer = element
break
}
}
element = element.parentElement
}
}
// Scroll to top
if (scrollContainer === window) {
window.scrollTo({ top: 0, behavior: 'smooth' })
} else {
(scrollContainer as HTMLElement).scrollTo({ top: 0, behavior: 'smooth' })
} }
}, []) }, [])

Loading…
Cancel
Save