fix: add scrolling including scroll shadow

Author: Flo0806

app/assets/main.css

@@ -322,3 +322,26 @@ html:has(dialog:modal) {
   overflow: hidden;
   scrollbar-gutter: stable;
 }
+
+/* Scroll shadow - disappears at scroll ends */
+@screen lg {
+  .scroll-shadow {
+    --_sh: oklch(0 0 0 / 0.12);
+    background:
+      linear-gradient(var(--bg) 30%, transparent) local,
+      linear-gradient(transparent, var(--bg) 70%) local,
+      radial-gradient(farthest-side at 50% 0, var(--_sh), transparent) scroll,
+      radial-gradient(farthest-side at 50% 100%, var(--_sh), transparent) scroll;
+    background-position: top, bottom, top, bottom;
+    background-size:
+      100% 3rem,
+      100% 3rem,
+      100% 1.5rem,
+      100% 1.5rem;
+    background-repeat: no-repeat;
+  }
+
+  :root[data-theme='dark'] .scroll-shadow {
+    --_sh: oklch(1 0 0 / 0.08);
+  }
+}

app/pages/package/[...package].vue

@@ -1008,9 +1008,11 @@ defineOgImageComponent('Package', {
         </p>
       </section>
 
-      <div class="area-sidebar">
+      <aside class="area-sidebar" aria-label="Package information">
         <!-- Sidebar -->
-        <div class="sticky top-34 space-y-6 sm:space-y-8 min-w-0 overflow-hidden xl:(top-22 pt-2)">
+        <div
+          class="scroll-shadow sticky top-34 space-y-6 sm:space-y-8 min-w-0 max-h-[calc(100dvh-9rem)] overflow-y-auto scrollbar-thin scrollbar-thumb-border pe-1 xl:(top-22 pt-2 max-h-[calc(100dvh-6rem)])"
+        >
           <!-- Maintainers (with admin actions when connected) -->
           <PackageMaintainers :package-name="pkg.name" :maintainers="pkg.maintainers" />
 
@@ -1070,7 +1072,7 @@ defineOgImageComponent('Package', {
             :optional-dependencies="displayVersion.optionalDependencies"
           />
         </div>
-      </div>
+      </aside>
     </article>
 
     <!-- Error state -->