Merge pull request #421 from bitdefender/DEX-21287

DEX-21287 product cards issues
bitdefender · Dec 3, 2024 · 422ee2a · 422ee2a
2 parents 4675f59 + 45ab80e
commit 422ee2a
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 16 deletions.
diff --git a/_src/blocks/products/products.css b/_src/blocks/products/products.css
@@ -495,18 +495,21 @@
 }
 
 @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: -40px 22px;
-    object-fit: cover;
+    object-position: -10px center;
+    object-fit:fill;
     border-radius: 50%;
     width: 250px;
     height: 250px;
     top: -42px;
     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,18 +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, svg))');
-      window.addEventListener('resize', () => {
-        if (firstPElement && window.matchMedia('(min-width: 1200px)').matches) {
-          firstPElement.style.maxWidth = '75%';
-        } else {
-          firstPElement.style.maxWidth = '';
-        }
-      });
-      window.dispatchEvent(new Event('resize'));
+      const firstPElement = card.querySelector('p:not(:has(img, .icon))');
+      firstPElement.classList.add('img-adjacent-text');
     }
 
     if (!card.classList.contains('featured')) {

diff --git a/_src/scripts/libs/store/resolver/resolver.js b/_src/scripts/libs/store/resolver/resolver.js
@@ -273,7 +273,7 @@ export class StoreResolver {
 			const globalClickAttributes = context.dataset.storeId ? [] : this.getAllAttributes(context, this.clickAttributes);
 
 			const pageContexts = [];
-			const contextProducts = products.map(product =>storeProducts[product.dataset.storeId])
+			const contextProducts = [...products, ...this.getAdditionalProducts(context)].map(product =>storeProducts[product.dataset.storeId])
 			for (const product of products) {
 				const storeProduct = storeProducts[product.dataset.storeId];
 				const productDataMapping = JSON.parse(product.dataset?.storeDevicePropertiesMapping || '{}');

diff --git a/_src/scripts/libs/store/resolver/staticAttributes/textVariable.js b/_src/scripts/libs/store/resolver/staticAttributes/textVariable.js
@@ -113,7 +113,6 @@ const replaceVariable = (text, context, variableParameters, textVariable) => {
             case "SMALLEST_PRICE_PER_MONTH":
                 let smallestPrice = Number.MAX_SAFE_INTEGER;
                 let currency = "";
-
                 if (context.contextProducts.length === 0) {
                     break;
                 }