+1 -1

app/globals.css

··· 490 490 animation-timing-function: ease-in; 491 491 } 492 492 493 493 - .postPageContent { 493 493 + .footnote-scope { 494 494 counter-reset: footnote; 495 495 } 496 496 .footnote-ref {

+2

app/lish/[did]/[publication]/[rkey]/Footnotes/PublishedFootnoteSideColumn.tsx

··· 12 12 13 13 export function PublishedFootnoteSideColumn(props: { 14 14 footnotes: PublishedFootnote[]; 15 15 + fullPageScroll?: boolean; 15 16 }) { 16 17 let items: PublishedFootnoteItem[] = props.footnotes.map((fn) => ({ 17 18 ...fn, ··· 47 48 <FootnoteSideColumnLayout 48 49 items={items} 49 50 visible={props.footnotes.length > 0} 51 51 + fullPageScroll={props.fullPageScroll} 50 52 getAnchorSelector={getAnchorSelector} 51 53 renderItem={renderItem} 52 54 />

+1 -1

app/lish/[did]/[publication]/[rkey]/LinearDocumentPage.tsx

··· 72 72 pageOptions={pageOptions} 73 73 footnoteSideColumn={ 74 74 !props.hasContentToRight ? ( 75 75 - <PublishedFootnoteSideColumn footnotes={footnotes} /> 75 75 + <PublishedFootnoteSideColumn footnotes={footnotes} fullPageScroll={fullPageScroll} /> 76 76 ) : undefined 77 77 } 78 78 >

+1 -1

app/lish/[did]/[publication]/[rkey]/StaticPostContent.tsx

··· 28 28 did: string; 29 29 }) { 30 30 return ( 31 31 - <div className="postContent flex flex-col"> 31 31 + <div className="postContent footnote-scope flex flex-col"> 32 32 {blocks.map((b, index) => { 33 33 return <Block block={b} did={did} key={index} />; 34 34 })}

+1 -1

components/Footnotes/FootnotePopover.tsx

··· 44 44 // were inserted out of order within a block. 45 45 let displayIndex = useMemo(() => { 46 46 if (!anchorElement || !footnote) return footnote?.index ?? 0; 47 47 - let container = anchorElement.closest(".postPageContent"); 47 47 + let container = anchorElement.closest('.footnote-scope'); 48 48 if (!container) return footnote.index; 49 49 let allRefs = Array.from(container.querySelectorAll(".footnote-ref")); 50 50 let pos = allRefs.indexOf(anchorElement);

+2

components/Footnotes/FootnoteSideColumn.tsx

··· 16 16 export function FootnoteSideColumn(props: { 17 17 pageEntityID: string; 18 18 visible: boolean; 19 19 + fullPageScroll?: boolean; 19 20 }) { 20 21 let { footnotes } = useFootnoteContext(); 21 22 let { permissions } = useEntitySetContext(); ··· 54 55 <FootnoteSideColumnLayout 55 56 items={items} 56 57 visible={props.visible} 58 58 + fullPageScroll={props.fullPageScroll} 57 59 getAnchorSelector={getAnchorSelector} 58 60 renderItem={renderItem} 59 61 />

+6 -1

components/Footnotes/FootnoteSideColumnLayout.tsx

··· 13 13 export function FootnoteSideColumnLayout<T extends FootnoteSideItem>(props: { 14 14 items: T[]; 15 15 visible: boolean; 16 16 + fullPageScroll?: boolean; 16 17 getAnchorSelector: (item: T) => string; 17 18 renderItem: (item: T & { top: number }) => ReactNode; 18 19 }) { ··· 106 107 return ( 107 108 <div 108 109 ref={containerRef} 109 109 - className="footnote-side-column hidden lg:block absolute top-0 left-full w-[200px] ml-3 pointer-events-none" 110 110 + className={`footnote-side-column hidden lg:block absolute top-0 w-[200px] pointer-events-none ${ 111 111 + props.fullPageScroll 112 112 + ? "left-[calc(50%+var(--page-width-units)/2+12px)]" 113 113 + : "left-full ml-3" 114 114 + }`} 110 115 style={{ height: "100%" }} 111 116 > 112 117 <div

+2 -1

components/Pages/Page.tsx

··· 76 76 <FootnoteSideColumn 77 77 pageEntityID={props.entityID} 78 78 visible={sideColumnVisible} 79 79 + fullPageScroll={props.fullPageScroll} 79 80 /> 80 81 } 81 82 > ··· 146 147 `} 147 148 > 148 149 <div 149 149 - className={`postPageContent 150 150 + className={`postPageContent footnote-scope 150 151 ${props.fullPageScroll ? "sm:max-w-[var(--page-width-units)] mx-auto" : "w-full h-full"} 151 152 `} 152 153 >