feat: add mouse wheel horizontal scroll to examples gallery, hide scrollbar

index.html

@@ -423,8 +423,15 @@
             display: flex;
             flex-wrap: nowrap;
             gap: 1rem;
-            overflow: hidden;
+            overflow-x: auto;
+            overflow-y: hidden;
             padding-bottom: 0.5rem;
+            scroll-behavior: smooth;
+            scrollbar-width: none;
+            -ms-overflow-style: none;
+        }
+        .examples-grid::-webkit-scrollbar {
+            display: none;
         }
         .examples-track {
             display: flex;
@@ -1195,6 +1202,23 @@
             setTimeout(() => t.style.display = 'none', 3000);
         }
 
+        // Enable mouse wheel horizontal scroll for examples gallery
+        const exGrid = document.getElementById('examples-grid');
+        let wheelTimeout = null;
+        exGrid.addEventListener('wheel', (e) => {
+            if (Math.abs(e.deltaY) > 0) {
+                e.preventDefault();
+                exGrid.scrollLeft += e.deltaY;
+                // Pause animation while scrolling
+                const track = exGrid.querySelector('.examples-track');
+                if (track) track.style.animationPlayState = 'paused';
+                clearTimeout(wheelTimeout);
+                wheelTimeout = setTimeout(() => {
+                    if (track) track.style.animationPlayState = 'running';
+                }, 1500);
+            }
+        }, { passive: false });
+
         init();
     </script>
 </body>