Merge pull request #3773 from andrzejewsky/bugfix/3772

Add media query for hover effect
vuestorefront · Nov 4, 2019 · acde81d · acde81d
2 parents e29a4ef + 33be862
commit acde81d
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 8 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -28,6 +28,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fixed instant checkout functionality - @andrzejewsky (#3765)
 - Fixed links to the promoted banners - @andrzejewsky (#3753)
 - Fixed missing parameter in the compare list - @andrzejewsky (#3757)
+- Fixed product link on mobile - @andrzejewsky (#3772)
 
 ### Added
 - Added support for ES7 - @andrzejewsky (#3690)

diff --git a/src/themes/default/components/core/ProductTile.vue b/src/themes/default/components/core/ProductTile.vue
@@ -208,16 +208,20 @@ $color-white: color(white);
     will-change: opacity, transform;
     transition: 0.3s opacity $motion-main, 0.3s transform $motion-main;
   }
-  &:hover {
-    .product-cover__thumb {
-      opacity: 1;
-      transform: scale(1.1);
-    }
-    &.sale::after,
-    &.new::after {
-      opacity: 0.8;
+
+  @media screen and (min-width: 768px) {
+    &:hover {
+      .product-cover__thumb {
+        opacity: 1;
+        transform: scale(1.1);
+      }
+      &.sale::after,
+      &.new::after {
+        opacity: 0.8;
+      }
     }
   }
+
   &.sale {
     &::after {
       @extend %label;