From 48a50958f43b52652e8f50e4bfb2d760a1cbe603 Mon Sep 17 00:00:00 2001
From: pacien
Date: Sat, 8 Feb 2020 18:02:28 +0100
Subject: viewer: fix sticky hover styling on links

This disables sticky hover styling on touch devices,
on which the virtual cursor doesn't leave the element after being tapped.
The fix can be applied to  elements by using the .link class.

GitHub: closes #94
---
 viewer/src/assets/scss/global.scss | 13 +++++++++++++
 1 file changed, 13 insertions(+)

(limited to 'viewer')

diff --git a/viewer/src/assets/scss/global.scss b/viewer/src/assets/scss/global.scss
index 4acaf13..d6b6562 100644
--- a/viewer/src/assets/scss/global.scss
+++ b/viewer/src/assets/scss/global.scss
@@ -62,6 +62,19 @@
   color: $disabled-color !important;
 }
 
+// Disable sticky hover styling on touch devices,
+// on which the virtual cursor doesn't leave the element after being tapped.
+// The fix can be applied to `a` elements by using the .link class.
+@media (hover:none), (hover:on-demand) {
+  .link:hover {
+    color: $link !important;
+  }
+
+  .disabled:hover {
+    color: $disabled-color !important;
+  }
+}
+
 // === Scrollbar styling
 
 .scrollbar {
-- 
cgit v1.2.3