fix: faz os ajustes finais na página

react/components/Html/styles.css

@@ -1,10 +1,102 @@
 [class*="productImageTag--main"] {
-  object-fit: none !important;
+  object-fit: contain !important;
   width: 98.225% !important;
   height: 100% !important;
   max-height: 664px !important;
 }
 
+[class*="subscriberContainer"] {
+  position: relative;
+  bottom: 20px;
+}
+
+@media (max-width: 639px) {
+  [class*="subscriberContainer"] :global(.vtex-store-components-3-x-form) {
+    display: flex;
+    flex-direction: row;
+  }
+}
+
+[class*="subscriberContainer"] :global(.vtex-button__label) {
+  font-size: 0;
+}
+
+[class*="subscriberContainer"] :global(.vtex-button__label)::after {
+  font-family: "Open Sans";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 18px;
+  line-height: 25px;
+  content: "AVISE-ME";
+}
+
+[class*="subscriberContainer"] :global(.vtex-store-components-3-x-form) {
+  width: 100%;
+}
+
+[class*="subscriberContainer"] :global(.vtex-input-prefix__group) {
+  width: 195.5px;
+}
+
+[class*="subscriberContainer"] :global(.vtex-store-components-3-x-submit) {
+  position: relative;
+  top: 35px;
+  right: 422px;
+  margin-top: 15px;
+}
+
+[class*="subscriberContainer"] :global(.vtex-button) {
+  width: 399px;
+  height: 49px;
+  background: black;
+  color: white;
+}
+
+[class*="arrow--1"] {
+  display: none;
+}
+
+[class*="link--1"] {
+  font-family: "Open Sans";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 19px;
+  color: #929292;
+}
+
+[class*="link--2"] {
+  font-family: "Open Sans";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 0;
+  line-height: 19px;
+  color: #929292;
+}
+
+[class*="link--2"]::after {
+  font-size: 14px;
+  content: "Sapatos";
+}
+
+[class*="homeLink"] {
+  font-family: "Open Sans";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 19px;
+  color: #929292;
+}
+
+[class*="term"] {
+  font-family: "Open Sans";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 19px;
+  color: #929292;
+}
+
 [class*="vtex-store-components-3-x-caretIcon"] {
   display: none;
 }
@@ -119,6 +211,10 @@
   border-color: black;
 }
 
+[class*="vtex-product-price-1-x-sellingPriceValue--summary"] {
+  font-size: 0 !important;
+}
+
 [class*="skuSelectorSubcontainer--tamanho"]
   :global(.vtex-store-components-3-x-frameAround) {
   border-radius: 24px;
@@ -153,6 +249,10 @@
   color: #929292;
 }
 
+[class*="vtex-input__error"] {
+  display: none;
+}
+
 [class*="productNameContainer"] {
   text-align: end;
 }
@@ -307,7 +407,7 @@
   border: none;
 }
 
-[class*="imageNormal"] {
+[class*="vtex-product-summary-2-x-imageNormal"] {
   width: 434.4px;
   height: 434.4px;
 }
@@ -487,13 +587,20 @@
   font-family: "Open Sans";
   font-style: normal;
   font-weight: 700;
-  font-size: 16px;
+  font-size: 14px;
   line-height: 19px;
   display: flex;
   align-items: center;
   font-weight: bold;
   color: #868686;
 }
+
+@media (min-width: 2500px) {
+  [class*="subscriberContainer"]
+    :global(.vtex-store-components-3-x-title)::after {
+  }
+}
+
 [class*="subscriberContainer"]
   :global(.vtex-store-components-3-x-subscribeLabel) {
   font-size: 0;
@@ -612,7 +719,7 @@
   [class*="listItemActive"] :global(.vtex-button) {
     border-bottom: none;
   }
-  [class*="imageNormal"] {
+  [class*="vtex-product-summary-2-x-imageNormalageNormal"] {
     width: 291.4px;
     height: 291.4px;
   }
@@ -623,7 +730,7 @@
 
   [data-testid="product-description"] {
     position: relative;
-    bottom: 125px;
+    bottom: 24px;
   }
 
   [class*="thumbImg--product-images"] {
@@ -632,6 +739,43 @@
 }
 
 @media (min-width: 2500px) {
+  [class*="listItem"] :global(.vtex-button) {
+    color: #bfbfbf;
+    border-radius: 0;
+    font-family: "Open Sans";
+    font-style: normal;
+    font-weight: 400;
+    font-size: 24px;
+    line-height: 38px;
+  }
+
+  [class*="listContainer"] {
+    width: 75%;
+    margin: auto;
+  }
+
+  [data-testid="product-description"]
+    :global(.vtex-store-components-3-x-container) {
+    margin-top: 64px !important;
+  }
+
+  [class="product-identifier__value"] {
+    font-family: "Open Sans";
+    font-style: normal;
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 19px;
+  }
+
+  [class*="productDescriptionText"]
+    :global(.vtex-store-components-3-x-container) {
+    margin: 0 !important;
+    width: 632px;
+    height: 66px;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 22px;
+  }
   [class*="vtex-store-components-3-x-container"] {
     width: 75%;
     margin: auto !important;
@@ -698,7 +842,7 @@
 }
 
 @media (max-width: 639px) {
-  [class*="imageNormal"] {
+  [class*="vtex-product-summary-2-x-imageNormal"] {
     width: 124.8px;
     height: 124.8px;
   }
@@ -712,9 +856,17 @@
   [class*="vtex-store-components-3-x-caretIcon"] {
     display: none;
   }
+
+  [class*="flexRow--button-cart"] {
+    width: 100% !important;
+  }
 }
 
 @media (max-width: 800px) {
+  [class*="shippingTable"] {
+    display: none;
+  }
+
   [class*="flexRow--button-cart"] {
     background-color: black;
     border-color: black;
@@ -732,5 +884,29 @@
   }
 }
 
-@media (max-width: 425px) {
+@media (max-width: 376px) {
+  [class*="vtex-store-components-3-x-imageElement"] {
+    max-width: 296px;
+  }
+
+  [class*="vtex-address-form__postalCode-forgottenURL"] {
+    bottom: 7px;
+    left: 57%;
+    margin-left: 0;
+  }
+
+  [class*="shippingContainer"] :global(.vtex-input-prefix__group) {
+    width: 83.532%;
+    height: 49px;
+  }
+
+  [class*="shippingContainer"] :global(.vtex-button) {
+    height: 49px;
+    left: 83.5%;
+    bottom: 110px;
+  }
+
+  [class*="flexRow--button-cart"] {
+    width: 100%;
+  }
 }

store/blocks/pdp/product.jsonc

@@ -6,8 +6,6 @@
       "html#product-description",
       "rich-text#textproducts",
       "list-context.product-list#produtos",
-      "rich-text#textnewsletter",
-      "newsletter",
       "product-questions-and-answers"
     ]
   },
@@ -43,9 +41,10 @@
   "html#prateleira": {
     "props": { "testId": "vtex-product-summary" },
     "children": [
-      "product-summary-image#shelf",
+      "product-summary-image",
       "product-summary-name",
-      "product-list-price",
+      "product-summary-price",
+      "product-list-price#summary",
       "product-selling-price#summary"
     ]
   },

styles/configs/font-faces.css

@@ -0,0 +1,4 @@
+@font-face {
+  font-family: "Open Sans", sans-serif;
+  src: url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap');
+}

styles/configs/style.json

@@ -1,26 +1,28 @@
 {
-    "typeScale": [
+  "typeScale": [3, 2.25, 1.5, 1.25, 1, 0.875, 0.75],
-        3, 2.25, 1.5, 1.25, 1, 0.875, 0.75
-      ],
   "spacing": [0.125, 0.25, 0.5, 0.75, 1, 1.5, 2, 3, 4, 8, 16],
   "customMedia": [
     { "s": 20 },
-        { "ns": {
+    {
+      "ns": {
         "value": 40,
         "minWidth": true
       }
     },
-        { "m": {
+    {
+      "m": {
         "value": 40,
         "minWidth": true
       }
     },
-        { "l": {
+    {
+      "l": {
         "value": 64,
         "minWidth": true
       }
     },
-        { "xl": {
+    {
+      "xl": {
         "value": 80,
         "minWidth": true
       }
@@ -253,84 +255,84 @@
     "measure": [30, 34, 20],
     "styles": {
       "heading-1": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "700",
         "fontSize": "3rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "heading-2": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "700",
         "fontSize": "2.25rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "heading-3": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "700",
         "fontSize": "1.75rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "heading-4": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "normal",
         "fontSize": "1.5rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "heading-5": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "normal",
         "fontSize": "1.25rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "heading-6": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "normal",
         "fontSize": "1.25rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "body": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "normal",
         "fontSize": "1rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "small": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "normal",
         "fontSize": "0.875rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "mini": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "normal",
         "fontSize": "0.75rem",
         "textTransform": "initial",
         "letterSpacing": "0"
       },
       "action": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "500",
         "fontSize": "1rem",
         "textTransform": "uppercase",
         "letterSpacing": "0"
       },
       "action--small": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "500",
         "fontSize": "0.875rem",
         "textTransform": "uppercase",
         "letterSpacing": "0"
       },
       "action--large": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
+        "fontFamily": "Open Sans, San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
         "fontWeight": "500",
         "fontSize": "1.25rem",
         "textTransform": "uppercase",

styles/css/vtex.breadcrumb.css

@@ -4,11 +4,17 @@
 .homeLink::after {
   content: "Home";
   position: relative;
-  bottom: 2px;
+  bottom: 1px;
 }
 
 .container {
   margin: 0 40px;
+  position: relative;
+  top: 48px;
+}
+
+[data-testid="product-price"] {
+  height: 38px;
 }
 
 @media (min-width: 2500px) {