refactor: altera css botão add carrinho

react/components/Html/styles.css

@@ -3,3 +3,15 @@
   justify-content: center;
   padding: 0 40px;
 }
+
+[class*="html--buy-button"] {
+  display: flex;
+  gap: 10px;
+}
+
+[class*="html--buy-button"] :global(.vtex-button) {
+  height: 49px;
+  background: black;
+  border: none;
+  border-radius: 0;
+}

store/blocks/pdp/product-assembly.jsonc

@@ -1,10 +1,10 @@
 {
-  "sticky-layout#buy-button": {
+  // "sticky-layout#buy-button": {
-    "props": {
+  //   "props": {
-      "position": "bottom"
+  //     "position": "bottom"
-    },
+  //   },
-    "children": ["flex-layout.row#buy-button"]
+  //   "children": ["flex-layout.row#buy-button"]
-  },
+  // },
   "product-assembly-options": {
     "children": [
       "flex-layout.row#product-assembly-options",
@@ -32,17 +32,13 @@
     "props": {
       "verticalAlign": "middle"
     },
-    "children": [
+    "children": ["assembly-option-item-quantity-selector"]
-      "assembly-option-item-quantity-selector"
-    ]
   },
   "flex-layout.col#product-assembly-image": {
     "props": {
       "marginRight": 4
     },
-    "children": [
+    "children": ["assembly-option-item-image"]
-      "assembly-option-item-image"
-    ]
   },
   "flex-layout.col#product-assembly-middle": {
     "props": {
@@ -96,9 +92,7 @@
       "horizontalAlign": "right",
       "verticalAlign": "middle"
     },
-    "children": [
+    "children": ["assembly-option-item-quantity-selector"]
-      "assembly-option-item-quantity-selector"
-    ]
   },
   "assembly-option-item-customize#sec-level": {
     "props": {

store/blocks/pdp/product.jsonc

@@ -119,7 +119,8 @@
       "product-installments",
       "sku-selector",
       "product-gifts",
-      "flex-layout.row#buy-button",
+      // "flex-layout.row#buy-button",
+      "html#buy-button",
       "availability-subscriber",
       "shipping-simulator",
       "share#default"
@@ -154,15 +155,22 @@
     }
   },
 
-  "flex-layout.row#buy-button": {
+  "html#buy-button": {
     "props": {
-      "blockClass": "buy-button",
+      "blockClass": "buy-button"
-      "marginTop": 4,
-      "marginBottom": 7
     },
     "children": ["product-quantity#addToCart", "add-to-cart-button#addToCart"]
   },
 
+  // "flex-layout.row#buy-button": {
+  //   "props": {
+  //     "blockClass": "buy-button",
+  //     "marginTop": 4,
+  //     "marginBottom": 7
+  //   },
+  //   "children": ["product-quantity#addToCart", "add-to-cart-button#addToCart"]
+  // },
+
   "product-quantity#addToCart": {
     "props": {
       "blockClass": "addToCartQuantity",

styles/css/vtex.flex-layout.css

@@ -112,12 +112,6 @@
   padding-bottom: 1rem;
 }
 
-.flexRowContent--buy-button :global(.vtex-button) {
-  background: black;
-  border: none;
-  border-radius: 0;
-}
-
 .flexRowContent--product-container {
   padding: 0 40px;
 }

styles/css/vtex.store-components.css

@@ -19,7 +19,6 @@
 
 .carouselGaleryThumbs {
   max-height: 90px;
-  width: 80%;
 }
 
 .productImageTag--main {
@@ -89,6 +88,10 @@
   font-size: 14px;
 }
 
+.productImagesThumb {
+  max-width: 90px;
+  margin-right: 16px;
+}
 .productImagesThumb .figure .thumbImg {
   width: 90px;
   height: 90px;

styles/sass/pages/product/vtex.flex-layout.scss

@@ -105,12 +105,6 @@
   padding-bottom: 1rem;
 }
 
-.flexRowContent--buy-button :global(.vtex-button) {
-  background: black;
-  border: none;
-  border-radius: 0;
-}
-
 .flexRowContent--product-container {
   padding: 0 40px;
 }

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

@@ -14,7 +14,6 @@
 
 .carouselGaleryThumbs {
   max-height: 90px;
-  width: 80%;
 }
 
 .productImageTag--main {
@@ -89,6 +88,8 @@
 }
 
 .productImagesThumb {
+  max-width: 90px;
+  margin-right: 16px;
   .figure {
     .thumbImg {
       width: 90px;