refactored code to remove unnecessary event listener

bitdefender · Dec 3, 2024 · 6222df7 · 6222df7
1 parent fd215e3
commit 6222df7
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 10 deletions.
diff --git a/_src/blocks/products/products.css b/_src/blocks/products/products.css
@@ -495,7 +495,7 @@
 }
 
 @media (min-width: 1200px) { /* desktop variation */
-  .products:not(.compact) .product-card img {
+  .products:not(.compact, .plans) .product-card img {
     display: inline;
     position: absolute;
     object-position: -10px center;
@@ -507,6 +507,9 @@
     right: -60px;
     border: 20px white solid;
   }
+  .product-card .img-adjacent-text{
+    width: 74%;
+  }
 }
 
 @media (min-width: 1600px) { /* large desktop */

diff --git a/_src/blocks/products/products.js b/_src/blocks/products/products.js
@@ -394,17 +394,10 @@ export default function decorate(block) {
   const featuredCard = block.querySelector('.product-card.featured');
   cards.forEach((card) => {
     const hasImage = card.querySelector('img') !== null;
-    if (hasImage) {
+    if (hasImage && !block.classList.contains('plans') && !block.classList.contains('compact')) {
       // If the image exists, set max-width to the paragraph next to the image
       const firstPElement = card.querySelector('p:not(:has(img, .icon))');
-      window.addEventListener('resize', () => {
-        if (firstPElement && window.matchMedia('(min-width: 1200px)').matches) {
-          firstPElement.style.maxWidth = '75%';
-        } else {
-          firstPElement.style.maxWidth = '';
-        }
-      });
-      window.dispatchEvent(new Event('resize'));
+      firstPElement.classList.add('img-adjacent-text');
     }
 
     if (!card.classList.contains('featured')) {