From 2cc75c71ac9c8241dc1b81d0a367138727adb7de Mon Sep 17 00:00:00 2001
From: Eleonora Otz <nora_otz@hotmail.com>
Date: Tue, 24 Jan 2023 16:55:58 -0300
Subject: [PATCH] =?UTF-8?q?feat:=20Ajusta=20margin=20e=20padding=20do=20co?=
 =?UTF-8?q?ntainer=20de=20informa=C3=A7=C3=B5es=20de=20produto?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 store/blocks/pdp/product.jsonc                |  3 +-
 styles/css/vtex.breadcrumb.css                |  7 ++-
 styles/css/vtex.flex-layout.css               |  5 ++
 styles/css/vtex.store-components.css          | 40 +++++++++++++++
 .../sass/pages/product/vtex.breadcrumb.scss   |  6 ++-
 .../sass/pages/product/vtex.flex-layout.scss  |  6 +++
 .../pages/product/vtex.store-components.scss  | 51 +++++++++++++++++--
 7 files changed, 111 insertions(+), 7 deletions(-)

diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index b96a6a7..6dd4a2f 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -45,6 +45,7 @@
   },
   "flex-layout.row#product-main": {
     "props": {
+      "blockClass": "product-main",
       "colGap": 7,
       "rowGap": 7,
       "marginTop": 4,
@@ -78,7 +79,7 @@
   "flex-layout.col#stack": {
     "children": ["stack-layout"],
     "props": {
-      "width": "60%",
+      // "width": "60%",
       "rowGap": 0
     }
   },
diff --git a/styles/css/vtex.breadcrumb.css b/styles/css/vtex.breadcrumb.css
index cd70e5f..58d74c0 100644
--- a/styles/css/vtex.breadcrumb.css
+++ b/styles/css/vtex.breadcrumb.css
@@ -8,7 +8,12 @@
 /* Media Query M3 */
 /* Grid breakpoints */
 .container {
-  margin: 8px 40px;
+  margin: 6px 36px;
+}
+@media screen and (min-width: 112.5em) {
+  .container {
+    margin: 6px 356px;
+  }
 }
 .container .link,
 .container .term {
diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css
index 0bffd8b..7a6df69 100644
--- a/styles/css/vtex.flex-layout.css
+++ b/styles/css/vtex.flex-layout.css
@@ -49,6 +49,11 @@
   font-size: 14px;
 }
 
+.flexRowContent--product-main {
+  margin: 0;
+  padding: 0;
+}
+
 .flexRow--deals {
   background-color: #0F3E99;
   padding: 14px 0px;
diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css
index f8fa6cb..8ca4fd7 100644
--- a/styles/css/vtex.store-components.css
+++ b/styles/css/vtex.store-components.css
@@ -9,4 +9,44 @@
 /* Grid breakpoints */
 .newsletter {
   background: red;
+}
+
+.container {
+  margin: 0 36px;
+  padding: 0 4px;
+}
+@media screen and (min-width: 112.5em) {
+  .container {
+    margin: 6px 356px;
+  }
+}
+
+.productImageTag--main {
+  max-height: max-content !important;
+  max-width: 664px;
+}
+
+.carouselGaleryThumbs {
+  margin-right: 16px;
+  max-height: 90px;
+}
+
+.thumbImg {
+  height: 90px;
+  max-width: 90px;
+}
+
+.carouselThumbBorder {
+  height: 90px;
+  width: 90px;
+}
+
+.figure {
+  width: 90px;
+  height: 90px;
+}
+
+.productImagesThumb {
+  max-width: 90px;
+  margin-right: 16px;
 }
\ No newline at end of file
diff --git a/styles/sass/pages/product/vtex.breadcrumb.scss b/styles/sass/pages/product/vtex.breadcrumb.scss
index 03a0063..04e2890 100644
--- a/styles/sass/pages/product/vtex.breadcrumb.scss
+++ b/styles/sass/pages/product/vtex.breadcrumb.scss
@@ -1,5 +1,9 @@
 .container {
-  margin: 8px 40px;
+  margin: 6px 36px;
+
+  @media screen and (min-width: 112.5em) {
+    margin: 6px 356px;
+  }
 
   .link,
   .term {
diff --git a/styles/sass/pages/product/vtex.flex-layout.scss b/styles/sass/pages/product/vtex.flex-layout.scss
index a7c5732..5be2ea5 100644
--- a/styles/sass/pages/product/vtex.flex-layout.scss
+++ b/styles/sass/pages/product/vtex.flex-layout.scss
@@ -32,6 +32,7 @@
   background-color: #f0f0f0;
 }
 
+
 .flexRowContent--menu-link :global(.vtex-menu-2-x-styledLink) {
   color: #ffffff;
   font-size: 14px;
@@ -42,6 +43,11 @@
   font-size: 14px;
 }
 
+.flexRowContent--product-main {
+  margin: 0;
+  padding: 0;
+}
+
 .flexRow--deals {
   background-color: #0F3E99;
   padding: 14px 0px;
diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss
index 55e1bca..ec1e657 100644
--- a/styles/sass/pages/product/vtex.store-components.scss
+++ b/styles/sass/pages/product/vtex.store-components.scss
@@ -2,10 +2,53 @@
   background: red;
 }
 
-// .caretIcon {
-//   display: none;
+.container {
+  margin: 0 36px;
+  padding: 0 4px;
+
+  @media screen and (min-width: 112.5em) {
+    margin: 6px 356px;
+  }
+}
+
+// .stretchChildrenWidth {
+//   width: 664px;
 // }
 
-// .swiper-pagination {
-//   display: none;
+// .stackItem--product {
+//   width: 664px;
 // }
+
+// .productImagesGallerySlide {
+//   width: 664px !important;
+// }
+
+.productImageTag--main {
+  max-height: max-content !important;
+  max-width: 664px;
+}
+
+.carouselGaleryThumbs {
+  margin-right: 16px;
+  max-height: 90px;
+}
+
+.thumbImg {
+  height: 90px;
+  max-width: 90px;
+}
+
+.carouselThumbBorder {
+  height: 90px;
+  width: 90px;
+}
+
+.figure {
+  width: 90px;
+  height: 90px;
+}
+
+.productImagesThumb {
+  max-width: 90px;
+  margin-right: 16px;
+}