diff --git a/react/components/Html/styles.css b/react/components/Html/styles.css
index 1dbc087..acc6381 100644
--- a/react/components/Html/styles.css
+++ b/react/components/Html/styles.css
@@ -14,6 +14,7 @@
gap: 10px;
align-items: center;
margin-bottom: 16px;
+ margin-top: 16px;
}
.html--pdp-productMain :global(.vtex-button){
display: none;
@@ -24,7 +25,12 @@
height: 49px;
max-width: 77.354%;
}
-
+.html--pdp-section_descriptions{
+ display: flex;
+ flex-direction: column;
+ gap: 32px;
+ padding: 0px 40px 0px 40px;
+}
@media screen and (min-width: 1920px){
.html--buy-button :global(.vtex-button){
max-width: 766px;
@@ -35,14 +41,12 @@
padding-left: 12.5393%;
margin: 0;
gap: 32px;
+ max-height: 100%;
+ }
+ .html--pdp-section_descriptions{
+ padding: 0px 12.5393% 0px 12.5393%;
}
}
-.html--pdp-section_descriptions{
- display: flex;
- flex-direction: column;
- gap: 32px;
- padding: 0px 40px 0px 40px;
-}
.html--pdp-section_descriptions :global(.vtex-flex-layout-0-x-flexRowContent){
gap: 32px;
}
diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index 2c1ff89..7cd91e4 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -333,6 +333,7 @@
},
"product-images#description": {
"props": {
+ "blockClass": "img-description",
"maxHeight": 872,
"testid": "product-images",
"aspectRatio": {
diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css
index e330da9..9444d75 100644
--- a/styles/css/vtex.flex-layout.css
+++ b/styles/css/vtex.flex-layout.css
@@ -182,6 +182,11 @@
.flexRow--pdp-carrousel :global(.vtex-store-components-3-x-container) {
max-width: 100%;
}
+@media screen and (min-width: 1920px) {
+ .flexRow--pdp-carrousel :global(.vtex-store-components-3-x-container) {
+ max-width: 96rem;
+ }
+}
.flexRow--pdp-price .flexRowContent--pdp-price {
justify-content: center;
diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css
index 695f34f..aba5c15 100644
--- a/styles/css/vtex.store-components.css
+++ b/styles/css/vtex.store-components.css
@@ -18,7 +18,7 @@
}
@media screen and (min-width: 1920px) {
.productImagesContainer--carousel .carouselGaleryCursor {
- max-height: 906px;
+ max-height: 100%;
}
}
@@ -167,6 +167,10 @@
}
}
+.productImageTag--img-description {
+ max-width: 872px;
+}
+
.carouselGaleryThumbs {
display: block;
height: max-content;
diff --git a/styles/sass/pages/product/vtex.flex-layout.scss b/styles/sass/pages/product/vtex.flex-layout.scss
index 0ae9d40..c59fd13 100644
--- a/styles/sass/pages/product/vtex.flex-layout.scss
+++ b/styles/sass/pages/product/vtex.flex-layout.scss
@@ -173,6 +173,9 @@
.flexRow--pdp-carrousel{
:global(.vtex-store-components-3-x-container){
max-width: 100%;
+ @media screen and (min-width: 1920px){
+ max-width: 96rem;
+ }
}
}
.flexRow--pdp-price{
diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss
index 2fba2a5..3d1bab5 100644
--- a/styles/sass/pages/product/vtex.store-components.scss
+++ b/styles/sass/pages/product/vtex.store-components.scss
@@ -9,7 +9,7 @@
}
.carouselGaleryCursor{
@media screen and (min-width: 1920px){
- max-height: 906px;
+ max-height: 100%;
}
}
}
@@ -152,6 +152,9 @@
}
}
}
+.productImageTag--img-description{
+ max-width: 872px;
+}
.carouselGaleryThumbs{
display: block;
height: max-content;