From 164815ac1471c22eed547f1a8663891006a7f6d9 Mon Sep 17 00:00:00 2001
From: ALi <s.arme@yandex.com>
Date: Tue, 13 Sep 2022 15:47:47 +0200
Subject: [PATCH] feat(Cursor): Check touch device by media query

---
 src/components/Cursor/index.jsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Cursor/index.jsx b/src/components/Cursor/index.jsx
index 65ea836..d894c89 100644
--- a/src/components/Cursor/index.jsx
+++ b/src/components/Cursor/index.jsx
@@ -40,7 +40,7 @@ export function Cursor({
   const color = hovered ? 'rgb(100 116 139)' : '#fff'
 
   useEffect(() => {
-    if (!('ontouchstart' in window)) {
+    if (!window.matchMedia('(pointer: coarse)').matches) {
       window.addEventListener(
         'mousemove',
         (e) => {
@@ -120,7 +120,7 @@ export function Cursor({
           outwards to the tunnels "Out". That means we can write dom nodes
           from within r3f, with full access to canvas state! */}
       <dom.In>
-        {!('ontouchstart' in window) && (
+        {!window.matchMedia('(pointer: coarse)').matches && (
           <div ref={outer} className='pointer-events-none absolute left-0 top-0 z-10'>
             <div
               className='w-[120px] h-[120px] border-2 border-solid border-[orange] rounded-[50%]'