react/components/Html/styles.css

@@ -4,6 +4,14 @@
   padding: 0 40px;
 }
 
+[class*="html--product-quantity"] {
+  width: 24.335%;
+}
+
+[class*="html--add-to-cart"] {
+  width: 100%;
+}
+
 [class*="html--buy-button"] {
   display: flex;
   gap: 10px;
@@ -36,6 +44,10 @@
 }
 
 @media (min-width: 1921px) {
+  [class*="html--product-quantity"] {
+    width: 16.712%;
+  }
+
   [class*="html--descriptionImage"] {
     width: 47.392%;
   }

react/components/PixPrice/styles.module.css

@@ -7,6 +7,7 @@
 .pixPrice-content {
   display: flex;
   gap: 26px;
+  width: 197px;
 }
 
 .pixPrice-img {

store/blocks/minicart.jsonc

@@ -1,4 +1,12 @@
 {
+  "html#add-to-cart": {
+    "props": {
+      "testId": "add-to-cart-button",
+      "blockClass": "add-to-cart"
+    },
+    "children": ["add-to-cart-button#addToCart"]
+  },
+
   "add-to-cart-button#addToCart": {
     "props": {
       "blockClass": "addToCart",

store/blocks/pdp/product.jsonc

@@ -94,6 +94,13 @@
     }
   },
   "flex-layout.row#product-image": {
+    "children": ["html#product-images"]
+  },
+  "html#product-images": {
+    "props": {
+      "testId": "product-images",
+      "blockClass": "product-images"
+    },
     "children": ["product-images"]
   },
   "product-images": {
@@ -120,17 +127,33 @@
       "product-rating-summary",
       "flex-layout.row#selling-price",
       "product-installments",
-      "PixPrice",
-      "sku-selector",
+      "html#pix",
+      "html#sku-selector",
       "product-gifts",
       // "flex-layout.row#buy-button",
       "html#buy-button",
       // "availability-subscriber",
-      "shipping-simulator",
+      "html#shipping-simulator",
       "share#default"
     ]
   },
 
+  "html#pix": {
+    "props": {
+      "blockClass": "pix",
+      "testId": "pix-price"
+    },
+    "children": ["PixPrice"]
+  },
+
+  "html#shipping-simulator": {
+    "props": {
+      "blockClass": "shipping-simulator",
+      "testId": "shipping-simulator"
+    },
+    "children": ["shipping-simulator"]
+  },
+
   "flex-layout.row#product-name": {
     "props": {
       "marginBottom": 3
@@ -153,6 +176,14 @@
     }
   },
 
+  "html#sku-selector": {
+    "props": {
+      "blockClass": "sku-selector",
+      "testId": "sku-selector"
+    },
+    "children": ["sku-selector"]
+  },
+
   "sku-selector": {
     "props": {
       "variationsSpacing": 3
@@ -163,7 +194,7 @@
     "props": {
       "blockClass": "buy-button"
     },
-    "children": ["product-quantity#addToCart", "add-to-cart-button#addToCart"]
+    "children": ["html#product-quantity", "html#add-to-cart"]
   },
 
   // "flex-layout.row#buy-button": {
@@ -175,12 +206,19 @@
   //   "children": ["product-quantity#addToCart", "add-to-cart-button#addToCart"]
   // },
 
+  "html#product-quantity": {
+    "props": {
+      "testId": "product-quantity",
+      "blockClass": "product-quantity"
+    },
+    "children": ["product-quantity#addToCart"]
+  },
+
   "product-quantity#addToCart": {
     "props": {
       "blockClass": "addToCartQuantity",
       "showLabel": false,
-      "size": "large",
-      "width": "25%"
+      "size": "large"
     }
   },
 
@@ -243,15 +281,6 @@
       "blockClass": "shelfTitleText"
     }
   },
-
-  "product-summary.shelf#shelfProducts": {
-    "children": [
-      "product-summary-image",
-      "product-summary-name",
-      "product-price"
-    ]
-  },
-
   // "product-summary-image": {
   //   "props": {
   //     "showBadge": false
@@ -267,6 +296,30 @@
 
   "list-context.product-list#shelfProducts": {
     "blocks": ["product-summary.shelf#shelfProducts"],
+    "children": ["html#slider-layout"]
+  },
+
+  "product-summary.shelf#shelfProducts": {
+    "children": ["html#product-summary"]
+  },
+
+  "html#product-summary": {
+    "props": {
+      "blockClass": "product-summary",
+      "testId": "vtex-product-summary"
+    },
+    "children": [
+      "product-summary-image",
+      "product-summary-name",
+      "product-price"
+    ]
+  },
+
+  "html#slider-layout": {
+    "props": {
+      "blockClass": "shelf",
+      "testId": "product-summary-list"
+    },
     "children": ["slider-layout#demo-products"]
   },
 

styles/css/vtex.product-quantity.css

@@ -26,4 +26,8 @@
   border: 1px solid #cccccc;
   border-left: 0;
   border-right: 0;
+}
+
+.quantitySelectorStepper--addToCartQuantity :global(.vtex-numeric-stepper__input) {
+  width: 100%;
 }

styles/css/vtex.product-summary.css

@@ -9,7 +9,6 @@
 @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap%27");
 /* Grid breakpoints */
 .imageWrapper {
-  height: 100%;
   width: 100%;
   display: flex;
   justify-content: center;

styles/sass/pages/product/vtex.product-quantity.scss

@@ -20,3 +20,8 @@
   border-left: 0;
   border-right: 0;
 }
+
+.quantitySelectorStepper--addToCartQuantity
+  :global(.vtex-numeric-stepper__input) {
+  width: 100%;
+}

styles/sass/pages/product/vtex.product-summary.scss

@@ -1,5 +1,4 @@
 .imageWrapper {
-  height: 100%;
   width: 100%;
   display: flex;
   justify-content: center;