ui: widen scroll thumb hit area

Make the thumb overlay 12px wide while keeping the visible bar 6px centered for easier hover/drag.

1 files changed, 4 insertions, 3 deletions

diff --git a/packages/ui/src/components/scroll-view.css b/packages/ui/src/components/scroll-view.css
index f81ae2976..91458fca5 100644
--- a/packages/ui/src/components/scroll-view.css
+++ b/packages/ui/src/components/scroll-view.css
@@ -17,9 +17,9 @@
 
 .scroll-view__thumb {
   position: absolute;
-  right: 0;
+  right: 1px;
   top: 0;
-  width: 16px;
+  width: 12px;
   transition: opacity 200ms ease;
   cursor: default;
   user-select: none;
@@ -29,7 +29,8 @@
 .scroll-view__thumb::after {
   content: "";
   position: absolute;
-  right: 4px;
+  left: 50%;
+  transform: translateX(-50%);
   top: 0;
   bottom: 0;
   width: 6px;