From 7b9e072713462bbbccde01ed7f76baae78bfc34a Mon Sep 17 00:00:00 2001
From: Martin Bauer <martin@bauer.tech>
Date: Sun, 4 Oct 2026 11:16:29 +0200
Subject: [PATCH] Browse: scroll the root shelves again, just without a
 scrollbar

Hiding the vertical scrollbar with overflow: hidden also stopped the wheel from
scrolling. Keep overflow: auto and hide only the bar, as the shelf rows already do.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 web/src/components/BrowseView.tsx | 7 +++----
 web/src/styles/app.css            | 8 +++++++-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/web/src/components/BrowseView.tsx b/web/src/components/BrowseView.tsx
index 234db59..2d59a0f 100644
--- a/web/src/components/BrowseView.tsx
+++ b/web/src/components/BrowseView.tsx
@@ -190,14 +190,13 @@ function BrowseViewImpl({
         />
         <div
           ref={scroller}
-          className={ANIMATE_VIEW_TRANSITIONS ? "view-enter" : undefined}
+          className={`no-scrollbar${ANIMATE_VIEW_TRANSITIONS ? " view-enter" : ""}`}
           // Right padding reserves room for the tab rail's own glass bar (see
           // TAB_RAIL_CLEARANCE) so a full-width shelf row never renders under it. The
-          // three rows fit the screen, so no vertical scrollbar: each row scrolls
-          // sideways on its own.
+          // vertical scrollbar is hidden, but the wheel and touch still scroll.
           style={{
             flex: 1,
-            overflow: "hidden",
+            overflow: "auto",
             minHeight: 0,
             padding: `14px ${TAB_RAIL_CLEARANCE}px 250px 32px`,
           }}
diff --git a/web/src/styles/app.css b/web/src/styles/app.css
index b50c945..043a968 100644
--- a/web/src/styles/app.css
+++ b/web/src/styles/app.css
@@ -273,11 +273,17 @@ button {
      focused. */
   padding: 14px 10px 14px;
   cursor: grab;
+}
+
+/* Scrolls by wheel, touch and keyboard, but draws no scrollbar. */
+.shelf-row,
+.no-scrollbar {
   scrollbar-width: none; /* Firefox */
   -ms-overflow-style: none; /* old Edge */
 }
 
-.shelf-row::-webkit-scrollbar {
+.shelf-row::-webkit-scrollbar,
+.no-scrollbar::-webkit-scrollbar {
   display: none; /* Chrome, Safari */
 }