Tab row scroll

apps/client/src/widgets/tab_row.ts

@@ -285,6 +285,7 @@ const TAB_ROW_TPL = `
         overflow-y: hidden;
         scrollbar-width: none; /* Firefox */
     }
+
     /* Chrome/Safari */
     .tab-row-widget-scrolling-container::-webkit-scrollbar {
         display: none;
@@ -391,15 +392,12 @@ export default class TabRowWidget extends BasicWidget {
                 return;
             }
             event.preventDefault();
-
-            const delta = Math.sign(wheelEvent.deltaX + wheelEvent.deltaY) *
-                Math.min(Math.abs(wheelEvent.deltaX + wheelEvent.deltaY), TAB_CONTAINER_MIN_WIDTH * 2);
-
-            this.scrollTabContainer(delta, "instant");
+            event.stopImmediatePropagation();
+            event.currentTarget.scrollLeft += wheelEvent.deltaY + wheelEvent.deltaX;
         });
 
-        this.$scrollButtonLeft[0].addEventListener('click', () => this.scrollTabContainer(-200));
-        this.$scrollButtonRight[0].addEventListener('click', () => this.scrollTabContainer(200));
+        this.$scrollButtonLeft[0].addEventListener('click', () => this.scrollTabContainer(-210));
+        this.$scrollButtonRight[0].addEventListener('click', () => this.scrollTabContainer(210));
 
         this.$tabScrollingContainer[0].addEventListener('scroll', () => {
             clearTimeout(this.updateScrollTimeout);
@@ -731,7 +729,7 @@ export default class TabRowWidget extends BasicWidget {
 
                 const scorllContainerBounds = this.$tabScrollingContainer[0]?.getBoundingClientRect();
                 const pointerX = pointer.pageX;
-                const scrollSpeed = 100; // The increment of each scroll.
+                const scrollSpeed = 105; // The increment of each scroll.
                 // Check if the mouse is near the edge of the container and trigger scrolling.
                 if (pointerX < scorllContainerBounds.left) {
                     this.scrollTabContainer(- scrollSpeed);