Set touch action for mobile devices

clauderic · Sep 17, 2024 · 0a1826e · 0a1826e
1 parent f7458d9
commit 0a1826e
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/apps/stories/.storybook/preview-head.html b/apps/stories/.storybook/preview-head.html
@@ -140,6 +140,7 @@
     outline: none;
     box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), inset 0 0 1px hsla(203, 50%, 30%, 0.5);
     white-space: nowrap;
+    touch-action: none;
   }
 
   button:not([class]):hover {

diff --git a/apps/stories/stories/react/icons/DraggableIcon.tsx b/apps/stories/stories/react/icons/DraggableIcon.tsx
@@ -1,5 +1,11 @@
 import draggableIcon from '../../assets/draggableIcon.svg';
 
 export const DraggableIcon = () => (
-  <img src={draggableIcon} width="140" alt="Draggable" draggable={false} />
+  <img
+    src={draggableIcon}
+    width="140"
+    alt="Draggable"
+    draggable={false}
+    style={{pointerEvents: 'none'}}
+  />
 );