Merge pull request #455 from bitdefender/DEX-21672

DEX-21672 background image is not full width + new-prod-boxes style fix
bitdefender · Jan 29, 2025 · 6420dbb · 6420dbb
2 parents d5a2568 + b49ea9f
commit 6420dbb
Show file tree

Hide file tree

Showing 7 changed files with 41 additions and 20 deletions.
diff --git a/_src-lp/blocks/b-antiransomware/b-antiransomware.css b/_src-lp/blocks/b-antiransomware/b-antiransomware.css
@@ -38,15 +38,16 @@
   background-size: 15px;
   background-position: left top 4px;
 }
-.b-antiransomware-container .bckImg {
+.b-antiransomware-container .bckImg picture {
+  float: right;
+}
+.b-antiransomware-container .bckImg picture img {
   position: absolute;
   height: 100%;
   width: 100%;
   top: 0;
   right: 0;
-}
-.b-antiransomware-container .bckImg picture {
-  float: right;
+  object-fit: cover;
 }
 
 @media screen and (width <= 768px) {
@@ -57,4 +58,7 @@
     font-size: 31px;
     line-height: 35px;
   }
+  .b-antiransomware-container .bckImg picture img {
+    display: none;
+  }
 }
diff --git a/_src-lp/blocks/b-antiransomware/b-antiransomware.scss b/_src-lp/blocks/b-antiransomware/b-antiransomware.scss
@@ -44,14 +44,17 @@
   }
 
   .bckImg {
-    position: absolute;
-    height: 100%;
-    width: 100%;
-    top: 0;
-    right: 0;
-
     picture {
       float: right;
+
+      img {
+        position: absolute;
+        height: 100%;
+        width: 100%;
+        top: 0;
+        right: 0;
+        object-fit: cover;
+      }
     }
   }
 }
@@ -67,5 +70,13 @@
       }
 
     }
+
+    .bckImg {
+      picture {
+        img {
+          display: none;
+        }
+      }
+    }
   }
 }
diff --git a/_src-lp/blocks/new-prod-boxes/new-prod-boxes.css b/_src-lp/blocks/new-prod-boxes/new-prod-boxes.css
@@ -328,6 +328,7 @@
   display: inline-block;
   border-radius: 20px;
   padding: 1px 12px;
+  margin-bottom: 5px;
 }
 
 .new-prod-boxes-container .block .prod_box .inner_prod_box .blueTag div {
@@ -439,10 +440,6 @@
   margin-bottom: 8px;
 }
 
-.new-prod-boxes-container.disable-product .prod_box.index1 .blueTag {
-  visibility: hidden;
-}
-
 .new-prod-boxes-container.disable-product .prod_box.index0 .blueTag {
   visibility: hidden;
 }

diff --git a/_src-lp/blocks/new-prod-boxes/new-prod-boxes.js b/_src-lp/blocks/new-prod-boxes/new-prod-boxes.js
@@ -482,6 +482,8 @@ export default function decorate(block) {
   };
 
   const targetNode = document.querySelector('.new-prod-boxes');
+  matchHeights(targetNode, '.tag-subtitle');
+  matchHeights(targetNode, '.save_price_box');
   matchHeights(targetNode, '.subtitle');
   matchHeights(targetNode, 'h2');
 

diff --git a/_src-lp/blocks/new-prod-boxes/new-prod-boxes.scss b/_src-lp/blocks/new-prod-boxes/new-prod-boxes.scss
@@ -367,6 +367,7 @@
     display: inline-block;
     border-radius: 20px;
     padding: 1px 12px;
+    margin-bottom: 5px;
 }
 
 .new-prod-boxes-container .block .prod_box .inner_prod_box .blueTag div {
@@ -478,12 +479,6 @@
     margin-bottom: 8px;
 }
 
-.new-prod-boxes-container.disable-product .prod_box.index1 {
-    .blueTag {
-        visibility: hidden;
-    }
-}
-
 .new-prod-boxes-container.disable-product .prod_box.index0 {
     .blueTag {
         visibility: hidden;

diff --git a/_src-lp/styles/styles.css b/_src-lp/styles/styles.css
@@ -482,6 +482,12 @@ main .section.size-12-normal .default-content-wrapper p {
   font-weight: normal;
 }
 
+main .section.size-14-normal .default-content-wrapper p {
+  font-size: 14px;
+  line-height: 16px;
+  font-weight: normal;
+}
+
 main .section[data-textcolor=grey] .default-content-wrapper p {
   color: #6F6F6F;
 }

diff --git a/_src-lp/styles/styles.scss b/_src-lp/styles/styles.scss
@@ -502,6 +502,12 @@ main .section.size-12-normal .default-content-wrapper p {
   font-weight: normal;
 }
 
+main .section.size-14-normal .default-content-wrapper p{
+  font-size: 14px;
+  line-height: 16px;
+  font-weight: normal;
+}
+
 main .section[data-textcolor='grey'] .default-content-wrapper p {
   color: #6F6F6F;
 }