Fix sticky hover on touch devices

[mimarz]

We should only show hover states on non-touch devices. Interacting with elements that have a hover-state on touch devices such as mobile or a table leads the hover state "stuck" after interacting with it.

I have previously solved this by wrapping our :hover selector in a designated media query which only enables them when hover is "supported". Look at Switch or Accordion for examples.

@media (hover: hover) and (pointer: fine) { 
/** :hover classes here */ 
}

Actions:

• Implement in following components.
  • [ ] Checkbox
  • [ ] Chip.Toggle
  • [ ] Radio
  • [ ] Button

Notes:

• https://medium.com/@mezoistvan/finally-a-css-only-solution-to-hover-on-touchscreens-c498af39c31c

[mimarz]

Assigning this to @Magnusrm as its a nice issue to get started with the designsystem @framitdavid :)