diff --git a/src/lib/components/ThreadScrubber.svelte b/src/lib/components/ThreadScrubber.svelte
index a8543c9..daed377 100644
--- a/src/lib/components/ThreadScrubber.svelte
+++ b/src/lib/components/ThreadScrubber.svelte
@@ -22,6 +22,7 @@
let dragStartY = 0;
let dragStartScrollTop = 0;
+ const isOverflowing = $derived(scrollHeight > clientHeight);
const maxScroll = $derived(Math.max(scrollHeight - clientHeight, 1));
const thumbHeight = $derived(
Math.max((clientHeight / scrollHeight) * trackHeight, 28),
@@ -130,7 +131,7 @@
diff --git a/src/routes/layout.css b/src/routes/layout.css
index 471bcea..b2b1b28 100644
--- a/src/routes/layout.css
+++ b/src/routes/layout.css
@@ -10,6 +10,13 @@ body {
background-color: var(--color-gray-100);
}
+.no-scrollbar {
+ scrollbar-width: none;
+}
+.no-scrollbar::-webkit-scrollbar {
+ display: none;
+}
+
@theme {
--color-brand: #e32a6d;
--color-brand-hover: #c4205a;
diff --git a/src/routes/thread/[id]/+page.svelte b/src/routes/thread/[id]/+page.svelte
index bdf4e3f..bcb839e 100644
--- a/src/routes/thread/[id]/+page.svelte
+++ b/src/routes/thread/[id]/+page.svelte
@@ -26,11 +26,15 @@
onMount(() => {
const main = document.querySelector("main");
if (!main) return;
+ main.classList.add("no-scrollbar");
const onScroll = () => {
isScrolled = main.scrollTop > 0;
};
main.addEventListener("scroll", onScroll, { passive: true });
- return () => main.removeEventListener("scroll", onScroll);
+ return () => {
+ main.classList.remove("no-scrollbar");
+ main.removeEventListener("scroll", onScroll);
+ };
});
// Measure OP's natural distance from main's border top (once after DOM is ready)