JSFiddle - React, Tailwind, and code Playground

HTML

<button class="btn-hover">Если мышь</button>
<button class="btn-sensor">Если сенсор</button>

<div style="height: 15px"></div>
Работает нормально в Android Chrome

CSS

.pointer-device .btn-hover:hover {
  background: yellow;
}

.touch-device .btn-sensor:active {
  background: yellow;
}

button {
  background: #000;
  color: #fff;
  padding: 25px;
}

JavaScript

// Проверка сенсорного экрана
function isTouchDeviceCheck() {
  var prefixes = ' -webkit- -moz- -o- -ms- '.split(' ');
  var mq = function(query) {
    return window.matchMedia(query).matches;
  }

  if (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch) {
    return true;
  }

  // include the 'heartz' as a way to have a non matching MQ to help terminate the join
  // https://git.io/vznFH
  var query = ['(', prefixes.join('touch-enabled),('), 'heartz', ')'].join('');
  return mq(query);
}

// Добавляем класс к body в зависимости от типа экрана
if (isTouchDeviceCheck()) {
  document.body.classList.add("touch-device");
} else {
  document.body.classList.add("pointer-device");
}