diff --git a/react/components/Html/styles.css b/react/components/Html/styles.css
index da001bc..9d35e26 100644
--- a/react/components/Html/styles.css
+++ b/react/components/Html/styles.css
@@ -38,12 +38,12 @@
color: #929292;
white-space: nowrap;
}
-.html--pdp-productMain{
+.html--pdp-productMain,.html--availability{
padding-right: 2.778%;
padding-left: 2.778%;
display: flex;
}
-.html--StackLayout,.html--pdp-InfoBuy{
+.html--StackLayout,.html--pdp-InfoBuy,.html--info-availability{
width: 50%;
}
@@ -54,8 +54,8 @@
margin-bottom: 16px;
margin-top: 16px;
}
-.html--pdp-productMain :global(.vtex-button){
- display: none;
+.html--pdp-productMain :global(.vtex-button),.html--availability :global(.vtex-button){
+ display: block;
}
.html--buy-button :global(.vtex-button){
display: block;
@@ -75,7 +75,7 @@
max-width: 766px;
width: 80.126%;
}
- .html--pdp-productMain{
+ .html--pdp-productMain,.html--availability{
padding-right: 12.5393%;
padding-left: 12.5393%;
margin: 0;
@@ -123,7 +123,7 @@
:global(.vtex-slider-layout-0-x-sliderTrackContainer--pdp-carrousel){
margin-bottom: 20px;
}
-.html--pdp-productMain :global(.vtex-store-components-3-x-container){
+.html--pdp-productMain :global(.vtex-store-components-3-x-container),.html--availability :global(.vtex-store-components-3-x-container){
max-width: 100%;
}
:global(.vtex-slider-layout-0-x-paginationDot--pdp-carrousel){
@@ -160,11 +160,11 @@
padding-top: 12px !important;
padding-bottom: 12px !important;
}
- .html--pdp-productMain{
+ .html--pdp-productMain,.html--availability{
flex-direction: column;
align-items: center;
}
- .html--StackLayout,.html--pdp-InfoBuy{
+ .html--StackLayout,.html--pdp-InfoBuy,.html--info-availability{
width: 89.23%;
}
.html--pdp-descriptions :global(.vtex-store-components-3-x-container){
diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index d2df9f1..db392cb 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -239,7 +239,7 @@
}
],
"Then": "html#product-main",
- "Else": "flex-layout.row#product-availability"
+ "Else": "html#product-availability"
}
},
@@ -428,28 +428,23 @@
}
},
- "flex-layout.row#product-availability": {
+ "html#product-availability": {
"props": {
- "colGap": 7,
- "marginTop": 4,
- "marginBottom": 7,
- "paddingTop": 7
+ "blockClass": "availability"
},
"children": [
"html#stack",
- "flex-layout.col#right-col-availability"
+ "html#right-col-availability"
]
},
- "flex-layout.col#right-col-availability": {
+ "html#right-col-availability": {
"props": {
- "preventVerticalStretch": true,
- "rowGap": 0,
"blockClass": "info-availability"
},
"children": [
"flex-layout.row#product-name",
- "sku-selector",
- "flex-layout.row#availability"
+ "flex-layout.row#availability",
+ "sku-selector"
]
},
"flex-layout.row#availability": {