From 142d3f460fa035ae3a6d17e38d74366c59ff3801 Mon Sep 17 00:00:00 2001
From: codecustard <emmanuelbarroga@gmail.com>
Date: Sat, 17 Jan 2026 15:14:40 -0800
Subject: [PATCH] fix: allow code page to scroll naturally like docs page

- Remove max-height constraint on code view that was keeping it
  contained within viewport
- Add scroll event listener alongside resize for dynamic panel adjustment
- Change overflow from 'auto' to 'overflow-x' only
- Add min-height to push footer below fold like other pages

This makes the code page scroll behavior consistent with the docs page,
allowing users to scroll the entire page to hide the hero/banner section.
---
 frontend/components/package/PackageCode.svelte | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/frontend/components/package/PackageCode.svelte b/frontend/components/package/PackageCode.svelte
index 630d2606..0131044a 100644
--- a/frontend/components/package/PackageCode.svelte
+++ b/frontend/components/package/PackageCode.svelte
@@ -118,7 +118,7 @@
 		if (curSelectedFileName === selectedFileName) {
 			fileContent = content;
 			fileContentHtml = html;
-			requestAnimationFrame(onResize);
+			requestAnimationFrame(onScroll);
 			requestAnimationFrame(scrollToDefiition);
 		}
 	}
@@ -200,20 +200,22 @@
 	let bottomSpace = 0;
 
 	// adjust side panels' height on scroll
-	let onResize = () => {
+	let onScroll = () => {
 		let filesTop = Math.max(0, filesEl.getBoundingClientRect().top);
 		let scrollTopWithFooter = document.body.scrollTop + document.body.clientHeight + footerHeight + margin - padding;
 		let footerSizeFiles = Math.max(bottomSpace, scrollTopWithFooter - document.body.clientHeight);
 
 		filesPanelHeight = `calc(100vh - ${Math.floor(filesTop + footerSizeFiles)}px)`;
-		codeViewEl.style.maxHeight = `calc(${Math.floor(window.innerHeight - codeViewEl.offsetTop - footerHeight - margin)}px)`;
+		// Removed max-height constraint on codeViewEl to allow natural page scrolling
 	};
 
 	onMount(() => {
-		filesEl && onResize();
-		window.addEventListener("resize", onResize);
+		filesEl && onScroll();
+		window.addEventListener("resize", onScroll);
+		window.addEventListener("scroll", onScroll);
 		return () => {
-			window.removeEventListener("resize", onResize);
+			window.removeEventListener("resize", onScroll);
+			window.removeEventListener("scroll", onScroll);
 		};
 	});
 </script>
@@ -353,7 +355,8 @@
 		font-family: monospace;
 		line-height: 1.55;
 		tab-size: 4;
-		overflow: auto;
+		overflow-x: auto;
+		min-height: 600px;
 	}
 
 	.code-view-wrap {