feat(decription):AJUSTANDO RESPONSIVIDADE

react/components/Html/styles.css

@@ -1,13 +1,6 @@
 /* [class*=html--pdp-breadcrumb]{
   background: blue;
 } */
-/* .html {
-  background-color: red;
-}
-
-.html--pdp-breadcrumb {
-  background-color: green;
-} */
 .html--pdp-section_descriptions{
   display: flex;
   flex-direction: column;
@@ -20,6 +13,15 @@
 .html--pdp-descriptions{
   display: flex;
 }
+.html--pdp-descriptions :global(.vtex-flex-layout-0-x-flexRow){
+  width: 100%;
+}
+.html--pdp-descriptions :global(.vtex-store-components-3-x-container){
+  max-width: 100%;
+}
+.html--pdp-descriptions :global(.vtex-store-components-3-x-productImage){
+  padding-left: 28px;
+}
 .html--pdp-departamens{
   background: transparent;
   margin-top: 32px;
@@ -63,6 +65,9 @@
     justify-content: end;
     padding: 0;
   }
+  .html--pdp-descriptions :global(.vtex-store-components-3-x-productImage){
+    padding-left: 0px;
+  }
   .html--pdp-departamens div ul li  :global(button.open){
     border-bottom: none;
   }

store/blocks/pdp/product.jsonc

@@ -1,11 +1,7 @@
 {
   "store.product": {
     "children": [
-      "html#breadcrumb",
+      "html#departaments"
-      "condition-layout.product#availability",
-      "html#departaments",
-      "flex-layout.row#specifications-title",
-      "html#carousel"
     ]
   },
   "html#carousel": {
@@ -39,15 +35,19 @@
 
   "product-summary.shelf#Pdp": {
     "children": [
-      "stack-layout#prodsum",
+      "stack-layout#pdp",
       "product-summary-name",
-      "product-summary-space",
       "product-list-price#summary",
       "product-installments#summary",
       "flex-layout.row#selling-price-savings"
     ]
   },
-
+  "stack-layout#pdp": {
+    "children": [
+      "product-summary-image#shelf",
+      "modal-trigger#quickview" // Check quickview.jsonc
+    ]
+  },
   "html#breadcrumb": {
     "props": {
       "tag": "section",
@@ -149,6 +149,7 @@
     },
     "children": ["html#Sections", "html#description"]
   },
+
   "html#description": {
     "props": {
       "tag": "div",
@@ -167,6 +168,7 @@
       "htmlId": "teste"
     }
   },
+
   "flex-layout.row#product-image": {
     "children": ["product-images"]
   },
@@ -185,6 +187,7 @@
   },
   "product-images#description": {
     "props": {
+      "maxHeight":872,
       "testid": "product-images",
       "aspectRatio": {
         "desktop": "1:1",

styles/css/vtex.store-components.css

@@ -127,7 +127,7 @@
   background: white;
   margin-right: 1em;
 }
-@media screen and (max-width: 64.0625em) {
+@media screen and (max-width: 1024px) {
   .carouselGaleryThumbs .productImagesThumb {
     width: 30% !important;
   }
@@ -142,7 +142,7 @@
   border-radius: 8px;
   min-height: 5.54em;
 }
-@media screen and (max-width: 64.0625em) {
+@media screen and (max-width: 1024px) {
   .carouselGaleryThumbs .productImagesThumb .figure--video .thumbImg {
     min-height: 4.9em;
   }
@@ -151,3 +151,47 @@
   border-radius: 8px;
   width: 90px;
 }
+
+@media screen and (max-width: 1024px) {
+  .productDescriptionContainer .productImageTag {
+    min-width: 296px;
+  }
+}
+.productDescriptionContainer .productDescriptionTitle {
+  font-family: "Open Sans", sans-serif;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 24px;
+  line-height: 32px;
+  color: #575757;
+}
+@media screen and (min-width: 1920px) {
+  .productDescriptionContainer .productDescriptionTitle {
+    font-size: 32px;
+  }
+}
+@media screen and (max-width: 1024px) {
+  .productDescriptionContainer .productDescriptionTitle {
+    font-size: 20px !important;
+  }
+}
+.productDescriptionContainer .content {
+  font-family: "Open Sans", sans-serif;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 22px;
+  color: #929292;
+}
+@media screen and (min-width: 1920px) {
+  .productDescriptionContainer .content {
+    font-size: 18px;
+    line-height: 25px;
+  }
+}
+@media screen and (max-width: 1024px) {
+  .productDescriptionContainer .content {
+    font-size: 14px !important;
+    line-height: 19px !important;
+  }
+}

styles/sass/pages/product/vtex.store-components.scss

@@ -120,7 +120,7 @@
     width: max-content !important;
     background:white;
     margin-right: 1em;
-    @media screen and (max-width: 64.0625em){
+    @media screen and (max-width: 1024px){
       width: 30% !important;
     }
     .figure{
@@ -130,7 +130,7 @@
         .thumbImg{
           border-radius: 8px;
           min-height: 5.54em;
-          @media screen and (max-width: 64.0625em){
+          @media screen and (max-width: 1024px){
             min-height: 4.9em;
           }
         }
@@ -142,4 +142,41 @@
     }
   }
 }
+.productDescriptionContainer{
+  .productImageTag{
+    @media screen and (max-width: 1024px){
+      min-width: 296px;
+    }
+  }
+  .productDescriptionTitle{
+    font-family: 'Open Sans',sans-serif;
+    font-style: normal;
+    font-weight: 400;
+    font-size: 24px;
+    line-height: 32px;
+    color: #575757;
+    @media screen and (min-width: 1920px){
+      font-size: 32px;
+    }
+    @media screen and (max-width: 1024px){
+      font-size: 20px !important;
+    }
+  }
+  .content{
+    font-family: 'Open Sans',sans-serif;
+    font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 22px;
+    color: #929292;
+    @media screen and (min-width: 1920px){
+      font-size: 18px;
+      line-height: 25px;
+    }
+    @media screen and (max-width: 1024px){
+      font-size: 14px !important;
+      line-height: 19px !important;
+    }
+  }
+}