Incorrect Device Detection (Incorrectly identifies laptop as mobile)

[Waaiez]

Saw this project on Twitter and wanted to give it a try I tried to open on my phone but was met with the "Seems like you're on mobile" screen which is to be expected I suppose

I then moved to my laptop to try it out and was met with the same "Seems like you're on mobile" screen which obviously shouldn't happen

Device Details: ASUS VivoBook S14 Flip 2880x1800 16:10 Touchscreen Display

Scenarios where Haptic works and doesn't (I am using my native resolution)

• Using the recommended 200% Scale in Windows - Does not work
• Same scenario as above but zooming out in Chrome to 75% - Works

--

• Using my preferred scale of 175% in Windows - Does not work
• Same scenario as above but zooming out in Chrome to 80% - Works

--

• Using 150% scale in Windows and the default 100% zoom in Chrome - Works

With all that said, the possible offending code is in your utils file and in your createDeviceDetector function

const highPixelRatio = window.devicePixelRatio > 1.5;

// Determine if it's a mobile/tablet device
const isMobileOrTablet = (hasTouch && hasMobileUserAgent) || (hasTouch && (smallScreen || highPixelRatio));

Particularly the:

(hasTouch && (smallScreen || highPixelRatio)

Because my laptop has a touch screen and has a high pixel ratio due to my windows scale settings

Not going to submit a PR to fix this because it likely affects a really small percentage of current/future users and just zooming out ""fixes"" the issue