disabling hover styles on touch/mobile devices

mixin-hover.styl

hover() {
  /body:not(.__device-touchdevice) {selector()}:hover {
    {block};
  }
}

on-page-loaded.js

if ('ontouchstart' in (document.documentElement || {})) {
  document.body.classList.add('__device-touchdevice');
}

out.styl

a {
  foo: 100;
}
body:not(.__device-touchdevice) a:hover {
  bar: 200;
}
body:not(.__device-touchdevice) a:hover img {
  baz: 300;
}

src.styl

a {
  foo: 100;

  +hover() {
    bar: 200;

    img {
      baz: 300;
    }
  }
}