remove product__media-container class

Shopify · Oct 14, 2022 · 6d13104 · 6d13104
1 parent 6e475e5
commit 6d13104
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/assets/magnify.js b/assets/magnify.js
@@ -30,7 +30,8 @@ function magnify(image, zoomRatio) {
   overlay.onmouseleave = () => overlay.remove();
 }
 
-function enableZoomOnHover(images, zoomRatio) {
+function enableZoomOnHover(zoomRatio) {
+  const images = document.querySelectorAll('.image-magnify__hover');
   images.forEach(image => {
     image.onclick = (event) => {
       magnify(image, zoomRatio);
@@ -39,5 +40,4 @@ function enableZoomOnHover(images, zoomRatio) {
   });
 }
 
-const hoverableImages = document.querySelectorAll('.image-magnify__hover');
-hoverableImages && enableZoomOnHover(hoverableImages, 2);
+enableZoomOnHover(2);
diff --git a/assets/section-main-product.css b/assets/section-main-product.css
@@ -1168,7 +1168,7 @@ a.product__text {
   }
 }
 
-.product__media-container {
+.js .product__media {
   overflow: hidden !important;
 }
 

diff --git a/snippets/product-thumbnail.liquid b/snippets/product-thumbnail.liquid
@@ -89,7 +89,7 @@
     </span>
   {%- endif -%}
 
-  <div class="product__media product__media-container media media--transparent gradient global-media-settings" style="padding-top: {{ 1 | divided_by: media.preview_image.aspect_ratio | times: 100 }}%;">
+  <div class="product__media media media--transparent gradient global-media-settings" style="padding-top: {{ 1 | divided_by: media.preview_image.aspect_ratio | times: 100 }}%;">
     {{ media.preview_image | image_url: width: 1946 | image_tag:
       class: image_class,
       loading: lazy,