From fe8043c232d3cf367eb787650a3a7e808abd2231 Mon Sep 17 00:00:00 2001 From: schroda <50052685+schroda@users.noreply.github.com> Date: Sun, 1 Sep 2024 01:39:13 +0200 Subject: [PATCH] Prevent manga page description from jumping on initial render Due to using the resize observer to get the actual chapter list header size, the size is 0 initially, which caused the virtuoso list height to be too big, causing an overflow and the scrollbar to appear. This scrollbar immediately disappeared again but still caused the description to slightly "jump" --- src/components/chapter/ChapterList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/chapter/ChapterList.tsx b/src/components/chapter/ChapterList.tsx index f910436d..1388ac4b 100644 --- a/src/components/chapter/ChapterList.tsx +++ b/src/components/chapter/ChapterList.tsx @@ -83,7 +83,7 @@ export const ChapterList = ({ const isMobileWidth = MediaQuery.useIsBelowWidth('md'); - const [chapterListHeaderHeight, setChapterListHeaderHeight] = useState(0); + const [chapterListHeaderHeight, setChapterListHeaderHeight] = useState(50); const [chapterListHeaderRef, setChapterListHeaderRef] = useState(null); useResizeObserver( chapterListHeaderRef,