feat(pdp/breadcrumb): added spacing in container

manifest.json

@@ -15,7 +15,6 @@
     "postreleasy": "vtex publish --verbose"
   },
   "dependencies": {
-    "agenciamagma.store-theme": "5.x",
     "vtex.store": "2.x",
     "vtex.store-header": "2.x",
     "vtex.product-summary": "2.x",

react/Example.tsx

@@ -1,3 +0,0 @@
-import Example from "./components/Example/Example";
-
-export default Example;

react/components/Example/Example.tsx

@@ -1,9 +0,0 @@
-import React from 'react'
-
-const Example = () => {
-  return (
-    <div>Example</div>
-  )
-}
-
-export default Example

store/blocks/home/home.jsonc

@@ -2,8 +2,6 @@
   "store.home": {
     "blocks": [
       "list-context.image-list#demo",
-      "example-component",      /* You can make references to blocks defined in other files.
-       * For example, `flex-layout.row#deals` is defined in the `deals.json` file. */
       "flex-layout.row#deals",
       "__fold__",
       "rich-text#shelf-title",

store/blocks/pdp/product.jsonc

@@ -18,6 +18,14 @@
     },
     "children": ["breadcrumb#pdp-breadcrumb"]
   },
+
+  "breadcrumb#pdp-breadcrumb": {
+    "props": {
+      "homeIconSize": 0,
+      "showOnMobile": true
+    }
+  },
+
   "flex-layout.row#specifications-title": {
     "children": ["rich-text#specifications"]
   },
@@ -87,13 +95,11 @@
   },
   "product-images": {
     "props": {
-      "aspectRatio": {
+      "aspectRatio": "1:1",
-        "desktop": "auto",
-        "phone": "16:9"
-      },
       "displayThumbnailsArrows": true
     }
   },
+
   "flex-layout.col#right-col": {
     "props": {
       "preventVerticalStretch": true,
@@ -113,8 +119,7 @@
       "product-gifts",
       "flex-layout.row#buy-button",
       "availability-subscriber",
-      "shipping-simulator",
+      "shipping-simulator"
-      "share#default"
     ]
   },
 
@@ -170,23 +175,5 @@
       "blockClass": "message-availability"
     },
     "children": ["availability-subscriber"]
-  },
-
-  "share#default": {
-    "props": {
-      "social": {
-        "Facebook": true,
-        "WhatsApp": true,
-        "Twitter": false,
-        "Pinterest": true
-      }
-    }
-  },
-
-  "breadcrumb#pdp-breadcrumb": {
-    "props": {
-      "homeIconSize": 0,
-      "showOnMobile": true
-    }
   }
 }

styles/css/agenciamagma.store-theme.css

@@ -6,20 +6,4 @@
 1800px + : Big desktop
 */
 /* Media Query M3 */
-/* Grid breakpoints */
+/* Grid breakpoints */
-.html--pdp-breadcrumb {
-  width: 100%;
-  padding: 0 40px;
-}
-@media screen and (min-width: 1025px) {
-  .html--pdp-breadcrumb {
-    width: 94.4444444444%;
-    padding: 0;
-    margin: 0 auto;
-  }
-}
-@media screen and (min-width: 1921px) {
-  .html--pdp-breadcrumb {
-    width: 68.75%;
-  }
-}

styles/css/vtex.breadcrumb.css

@@ -9,11 +9,23 @@
 /* Grid breakpoints */
 .container {
   width: 100%;
-  display: inline-flex;
+  display: flex;
   flex-wrap: wrap;
   flex-basis: 100%;
   align-items: baseline;
 }
+@media screen and (min-width: 1025px) {
+  .container {
+    width: 94.4444444444%;
+    padding: 0;
+    margin: 0 auto;
+  }
+}
+@media screen and (min-width: 1921px) {
+  .container {
+    width: 68.75%;
+  }
+}
 
 .termArrow {
   padding: 0;

styles/sass/pages/product/agenciamagma.store-theme.scss

@@ -1,14 +0,0 @@
-.html--pdp-breadcrumb {
-  width: 100%;
-  padding: 0 40px;
-
-  @media screen and (min-width: 1025px) {
-    width: 94.44444444444444%;
-    padding: 0;
-    margin: 0 auto;
-  }
-
-  @media screen and (min-width: 1921px) {
-    width: 68.75%;
-  }
-}

styles/sass/pages/product/vtex.breadcrumb.scss

@@ -1,9 +1,19 @@
 .container {
   width: 100%;
-  display: inline-flex;
+  display: flex;
   flex-wrap: wrap;
   flex-basis: 100%;
   align-items: baseline;
+
+  @media screen and (min-width: 1025px) {
+    width: 94.44444444444444%;
+    padding: 0;
+    margin: 0 auto;
+  }
+
+  @media screen and (min-width: 1921px) {
+    width: 68.75%;
+  }
 }
 
 .termArrow {