diff --git a/app/p/[didOrHandle]/(profile)/ProfileTabs.tsx b/app/p/[didOrHandle]/(profile)/ProfileTabs.tsx index 35d5f168..95f30b56 100644 --- a/app/p/[didOrHandle]/(profile)/ProfileTabs.tsx +++ b/app/p/[didOrHandle]/(profile)/ProfileTabs.tsx @@ -22,9 +22,15 @@ export const ProfileTabs = (props: { didOrHandle: string }) => { const profileContent = document.getElementById("profile-content"); const handleScroll = () => { if (profileContent) { - setScrollPosWithinTabContent(profileContent.scrollTop - headerHeight); + setScrollPosWithinTabContent( + profileContent.scrollTop - headerHeight > 0 + ? profileContent.scrollTop - headerHeight + : 0, + ); } }; + console.log("content: " + profileContent); + console.log("header: " + headerHeight); if (profileContent) { profileContent.addEventListener("scroll", handleScroll); @@ -34,20 +40,19 @@ export const ProfileTabs = (props: { didOrHandle: string }) => { const baseUrl = `/p/${props.didOrHandle}`; const bgColor = !cardBorderHidden ? "var(--bg-leaflet)" : "var(--bg-page)"; + console.log(scrollPosWithinTabContent); return (
0 && scrollPosWithinTabContent < 20 - ? { - paddingLeft: `calc(${scrollPosWithinTabContent / 20} * 12px )`, - paddingRight: `calc(${scrollPosWithinTabContent / 20} * 12px )`, - } - : { paddingLeft: "12px", paddingRight: "12px" } + scrollPosWithinTabContent < 20 + ? { + paddingLeft: `calc(${scrollPosWithinTabContent / 20} * 12px )`, + paddingRight: `calc(${scrollPosWithinTabContent / 20} * 12px )`, + } + : { paddingLeft: "12px", paddingRight: "12px" } } >
-
+
{props.children}