#287 Prevent link hover effect on touchscreens

victrme · Feb 7, 2024 · 94a377c · 94a377c
1 parent dcbc352
commit 94a377c
Showing 1 changed file with 11 additions and 6 deletions.
diff --git a/src/styles/features/links.scss b/src/styles/features/links.scss
@@ -163,20 +163,25 @@ li.block {
 		overflow: hidden;
 	}
 
-	&.selected div,
-	&:hover div {
+	&.selected div {
 		box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.2);
 	}
 
-	&:hover:not(.selected) div {
-		transform: scale(0.95);
-	}
-
 	&.selected div {
 		outline: 0.3em solid var(--color-blue);
 	}
 }
 
+@media only screen and (hover: hover) {
+	li.block:hover div {
+		box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.2);
+	}
+
+	li.block:hover:not(.selected) div {
+		transform: scale(0.95);
+	}
+}
+
 li.block.folder > div {
 	display: grid;
 	column-gap: 4px;