diff --git a/react/components/Html/styles.css b/react/components/Html/styles.css
index ff94055..8925940 100644
--- a/react/components/Html/styles.css
+++ b/react/components/Html/styles.css
@@ -179,12 +179,6 @@ button[class*="vtex-numeric-stepperminus-button numeric-stepperminus-button br2
color: black;
}
-[class*="vtex-store-components-3-x-productImageTag--main"] {
- width: 904px;
- height: 904px;
- max-height: 900px !important;
-}
-
[class*="pix-container"] {
display: flex;
}
@@ -218,6 +212,27 @@ button[class*="vtex-numeric-stepperminus-button numeric-stepperminus-button br2
}
-.html--botaoadc-quantidade {
- display: flex;
+
+@media screen and (min-width: 768px) {
+ .html--botaoadc-quantidade {
+ display: flex;
+ }
}
+
+
+@media screen and (max-width: 1024px){
+
+ [class*="vtex-tab-layout-0-x-listItem"]{
+ border: none;
+ width: 100%;
+ display: flex;
+ }
+
+ [class*="vtex-tab-layout-0-x-listItemActive"] {
+ border: none;
+ width: 100%;
+ display: flex;
+ }
+}
+
+
diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css
index b071c30..54eb90d 100644
--- a/styles/css/vtex.flex-layout.css
+++ b/styles/css/vtex.flex-layout.css
@@ -8,13 +8,14 @@
/* Media Query M3 */
/* Grid breakpoints */
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap");
-.flexRowContent--btn-product {
- margin: 0;
+@media screen and (min-width: 768px) {
+ .flexRowContent--btn-product {
+ margin: 0 10px;
+ }
}
.flexRow--btn-product {
width: 100%;
- margin: 0 10px;
}
.flexRow--btn-product :global(.vtex-button) {
background-color: black;
diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css
index aefd9ab..9fb896a 100644
--- a/styles/css/vtex.store-components.css
+++ b/styles/css/vtex.store-components.css
@@ -198,6 +198,13 @@
width: 50%;
margin-left: 16px;
}
+@media screen and (max-width: 1024px) {
+ .productDescriptionContainer {
+ width: 100%;
+ margin-left: 0;
+ margin-top: 16px;
+ }
+}
.carouselGaleryThumbs {
height: 200px;
@@ -303,4 +310,10 @@
font-size: 18px;
line-height: 25px;
text-transform: uppercase;
+}
+
+@media screen and (max-width: 1023px) {
+ .content--imagem-descricao {
+ width: 100%;
+ }
}
\ No newline at end of file
diff --git a/styles/sass/pages/product/vtex.flex-layout.scss b/styles/sass/pages/product/vtex.flex-layout.scss
index 9a6460b..e6cd054 100644
--- a/styles/sass/pages/product/vtex.flex-layout.scss
+++ b/styles/sass/pages/product/vtex.flex-layout.scss
@@ -9,12 +9,18 @@
// }
.flexRowContent--btn-product {
- margin: 0;
+
+
+ @media screen and (min-width: 768px) {
+ margin: 0 10px;
+ }
}
.flexRow--btn-product {
width: 100%;
- margin: 0 10px;
+
+
+
:global(.vtex-button) {
background-color: black;
@@ -36,3 +42,5 @@
.flexRowContent--container-main {
padding: 0 40px;
}
+
+
diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss
index 62346e9..4d9d192 100644
--- a/styles/sass/pages/product/vtex.store-components.scss
+++ b/styles/sass/pages/product/vtex.store-components.scss
@@ -221,6 +221,12 @@
.productDescriptionContainer {
width: 50%;
margin-left: 16px;
+
+ @media screen and (max-width: 1024px) {
+ width: 100%;
+ margin-left: 0;
+ margin-top: 16px;
+ }
}
.carouselGaleryThumbs {
@@ -350,3 +356,11 @@
}
}
}
+
+
+
+.content--imagem-descricao {
+ @media screen and (max-width: 1023px) {
+ width: 100%;
+ }
+}
diff --git a/styles/sass/pages/product/vtex.tab-layout.scss b/styles/sass/pages/product/vtex.tab-layout.scss
index b92765f..07bd52d 100644
--- a/styles/sass/pages/product/vtex.tab-layout.scss
+++ b/styles/sass/pages/product/vtex.tab-layout.scss
@@ -1,4 +1,3 @@
-
.listContainer {
display: flex;
justify-content: space-evenly;
@@ -16,7 +15,20 @@
flex-direction: row-reverse;
@media screen and (max-width: 1024px) {
-
flex-direction: column-reverse;
}
}
+
+
+// .productImageTag--main {
+// @media screen and (max-width: 1024px){
+// max-height: 1000px !important;
+// width: 100%;
+// }
+// }
+
+// .swiper-slide {
+// @media screen and (max-width: 1024px) {
+// display: none;
+// }
+// }