From 7f2adf5117f25ce666ec4fa8d628cd3123b32aa6 Mon Sep 17 00:00:00 2001
From: Carl Worth <cworth@cworth.org>
Date: Mon, 8 Jun 2020 09:13:43 -0700
Subject: [PATCH] Restrict :hover styling to when a media query says hover is
 fully supported

Otherwise, on my phone I was seeing "sticky" hover effects, (after I
clicked a button it stayed looking like it was still being pressed
after I let go which was very confusing).
---
 style.css | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/style.css b/style.css
index 240014a..b4d5b1b 100644
--- a/style.css
+++ b/style.css
@@ -82,8 +82,10 @@ a:link    {
 a:visited {
     color: var(--accent-color);
 }
-a:hover   {
-    color: var(--accent-color-bright);
+@media (hover:hover) {
+    a:hover   {
+        color: var(--accent-color-bright);
+    }
 }
 a:active  {
     color: var(--accent-color-bright);
@@ -279,9 +281,11 @@ button.inline {
     width: auto;
 }
 
-button:hover {
-    transform: translateY(-1px);
-    background-color: var(--accent-color-bright);
+@media (hover:hover) {
+    button:hover {
+        transform: translateY(-1px);
+        background-color: var(--accent-color-bright);
+    }
 }
 
 :focus {
@@ -332,8 +336,10 @@ button:hover {
     top: 0;
 }
 
-.hide-button:hover {
-    color: var(--danger-color-dark);
+@media (hover:hover) {
+    .hide-button:hover {
+        color: var(--danger-color-dark);
+    }
 }
 
 /*\
-- 
2.43.0