refactor: ajusta css breadcrumb 1440px e 1024px

react/components/Html/styles.css

@@ -1,7 +1,6 @@
 [class*="html--pdp-breadcrumb"] {
   display: flex;
   justify-content: center;
-  padding: 0 40px;
 }
 
 [class*="html--selling-price"] {
@@ -63,6 +62,10 @@
 }
 
 @media (max-width: 1024px) {
+  [class*="html--pdp-breadcrumb"] {
+    padding: 0 40px;
+  }
+
   [class*="html--product-quantity"] {
     width: 149.91px;
   }

styles/css/vtex.add-to-cart-button.css

@@ -0,0 +1,13 @@
+/*
+0 - 600PX: Phone
+600 - 900px: Table portrait
+900 - 1200px: Tablet landscape
+[1200 - 1800] is where our nortal styles apply
+1800px + : Big desktop
+*/
+/* Media Query M3 */
+@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap%27");
+/* Grid breakpoints */
+.buttonText--addToCart {
+  font-size: 18px;
+}

styles/css/vtex.breadcrumb.css

@@ -10,8 +10,7 @@
 @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap%27");
 /* Grid breakpoints */
 .container {
-  width: 100%;
-  max-width: 1920px;
+  width: 94.445%;
 }
 
 .termArrow,
@@ -32,6 +31,7 @@
   font-size: 16px;
   position: absolute;
   top: 17%;
+  left: 0;
 }
 
 .link--1 {
@@ -58,4 +58,9 @@
   .container {
     max-width: 1840px;
   }
+}
+@media (max-width: 1024px) {
+  .container {
+    width: 100%;
+  }
 }

styles/css/vtex.rich-text.css

@@ -19,4 +19,9 @@
   .heading-level-1 {
     margin-top: 16px;
   }
+}
+@media (max-width: 767px) {
+  .heading-level-1 {
+    font-size: 20px;
+  }
 }

styles/css/vtex.store-components.css

@@ -161,6 +161,10 @@
   height: 49px;
 }
 
+.shippingContainer :global(.vtex-address-form-4-x-input) {
+  padding-bottom: 7px;
+}
+
 .shippingContainer :global(.vtex-button) {
   width: 49px;
   height: 49px;

styles/sass/pages/product/vtex.add-to-cart-button.scss

@@ -0,0 +1,3 @@
+.buttonText--addToCart {
+  font-size: 18px;
+}

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

@@ -1,6 +1,5 @@
 .container {
-  width: 100%;
-  max-width: 1920px;
+  width: 94.445%;
 }
 
 .termArrow,
@@ -21,6 +20,7 @@
   font-size: 16px;
   position: absolute;
   top: 17%;
+  left: 0;
 }
 
 .link--1 {
@@ -48,3 +48,9 @@
     max-width: 1840px;
   }
 }
+
+@media (max-width: 1024px) {
+  .container {
+    width: 100%;
+  }
+}

styles/sass/pages/product/vtex.rich-text.scss

@@ -10,3 +10,9 @@
     margin-top: 16px;
   }
 }
+
+@media (max-width: 767px) {
+  .heading-level-1 {
+    font-size: 20px;
+  }
+}

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

@@ -160,6 +160,10 @@
   height: 49px;
 }
 
+.shippingContainer :global(.vtex-address-form-4-x-input) {
+  padding-bottom: 7px;
+}
+
 .shippingContainer :global(.vtex-button) {
   width: 49px;
   height: 49px;