diff --git a/react/components/Html/styles.css b/react/components/Html/styles.css
index e446a4d..03dbac8 100644
--- a/react/components/Html/styles.css
+++ b/react/components/Html/styles.css
@@ -20,7 +20,7 @@
}
}
-[class*=""] {
+/* [class*=""] {
-}
+} */
diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css
index 1466295..8a3394b 100644
--- a/styles/css/vtex.flex-layout.css
+++ b/styles/css/vtex.flex-layout.css
@@ -32,6 +32,11 @@
.flexRowContent--divProductIndisponivel {
gap: 32px;
}
+@media (max-width: 1024px) {
+ .flexRowContent--divProductIndisponivel {
+ flex-direction: column;
+ }
+}
.flexColChild--info-availability .flexRow--divNomeProduct {
text-align: end;
diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css
index beab778..6177a57 100644
--- a/styles/css/vtex.store-components.css
+++ b/styles/css/vtex.store-components.css
@@ -71,6 +71,48 @@
padding-bottom: 16px !important;
border: 0;
}
+.newsletter--newsletter .container--newsletter .form--newsletter {
+ min-width: 744px;
+}
+@media (max-width: 1024px) {
+ .newsletter--newsletter .container--newsletter .form--newsletter {
+ margin: 0;
+ width: 100%;
+ max-width: 100%;
+ padding: 0;
+ min-width: 265px;
+ }
+}
+@media (max-width: 1024px) {
+ .newsletter--newsletter .container--newsletter .form--newsletter .inputGroup--newsletter {
+ display: flex;
+ width: inherit;
+ justify-content: start;
+ align-items: baseline;
+ }
+}
+.newsletter--newsletter .container--newsletter .form--newsletter .label--newsletter {
+ font-family: "Open Sans";
+ font-style: normal;
+ font-weight: 400;
+ font-size: 24px;
+ line-height: 38px;
+ text-align: center;
+ color: #ffffff;
+ display: flex;
+ flex-direction: column;
+ min-width: 313px;
+}
+.newsletter--newsletter .container--newsletter .form--newsletter .label--newsletter::after {
+ content: "Receba ofertas e novidades por e-mail";
+ font-family: "Open Sans";
+ font-style: normal;
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 22px;
+ text-align: center;
+ color: #929292;
+}
.buttonContainer--newsletter {
padding-left: 0 !important;
@@ -147,6 +189,17 @@
content: "OUTROS CORES:";
font-size: 14px;
}
+.skuSelectorContainer--divSku .skuSelectorSubcontainer--cor .skuSelectorItem--divSku--selected .frameAround--divSku {
+ border: 3px solid black !important;
+ width: 52px !important;
+ height: 52px !important;
+ top: -2px !important;
+ left: -2px !important;
+}
+.skuSelectorContainer--divSku .skuSelectorSubcontainer--cor .skuSelectorItem--divSku--selected .diagonalCross--divSku {
+ color: black !important;
+ border: 1px solid black !important;
+}
.skuSelectorContainer--divSku .skuSelectorSubcontainer--cor .skuSelectorItem--divSku {
width: 48px;
height: 48px;
@@ -195,15 +248,25 @@
content: "OUTROS TAMANHOS:";
font-size: 14px;
}
+.skuSelectorContainer--divSku .skuSelectorSubcontainer--tamanho .skuSelectorItem--divSku--selected .frameAround--divSku {
+ border: 3px solid black !important;
+}
+.skuSelectorContainer--divSku .skuSelectorSubcontainer--tamanho .skuSelectorItem--divSku--selected .diagonalCross--divSku {
+ height: 40px;
+ width: 40px;
+ border-radius: 50%;
+ color: black !important;
+ border: 1px solid black !important;
+ transform: rotate(-90deg);
+}
.skuSelectorContainer--divSku .skuSelectorSubcontainer--tamanho .skuSelectorItem--divSku {
width: 40px;
height: 40px;
+ border-radius: 50%;
}
.skuSelectorContainer--divSku .skuSelectorSubcontainer--tamanho .skuSelectorItem--divSku .frameAround--divSku {
- border: 1px solid #989898;
border-radius: 50%;
- width: 40px;
- height: 40px;
+ border: 0.5px solid #989898;
top: 0;
bottom: 0;
right: 0;
@@ -230,6 +293,8 @@
height: 40px;
width: 40px;
border-radius: 50%;
+ color: #d5d5d5;
+ border: 1px solid #d5d5d5;
transform: rotate(-90deg);
}
.skuSelectorContainer--divSku .diagonalCross--divSku {
@@ -438,24 +503,24 @@
}
.subscriberContainer .form .content {
display: grid;
- grid-template-areas: "1" "2";
+ grid-template-areas: "name email" "submit submit";
justify-content: inherit;
gap: 10px;
width: 100%;
max-width: 100%;
}
.subscriberContainer .form .content .inputName {
- grid-area: 1;
+ grid-area: name;
margin-right: 0;
margin-bottom: 0;
}
.subscriberContainer .form .content .inputEmail {
- grid-area: 1;
+ grid-area: email;
margin-right: 0;
margin-bottom: 0;
}
.subscriberContainer .form .content .submit {
- grid-area: 2;
+ grid-area: submit;
}
.subscriberContainer .form .content .submit :global(.vtex-button) {
width: 100%;
diff --git a/styles/css/vtex.tab-layout.css b/styles/css/vtex.tab-layout.css
index acff555..6153fbb 100644
--- a/styles/css/vtex.tab-layout.css
+++ b/styles/css/vtex.tab-layout.css
@@ -29,6 +29,11 @@
margin: 0;
padding: 0;
}
+@media (max-width: 1024px) {
+ .container--estrutura .listContainer--Guias .listItem--renderGuia {
+ width: inherit;
+ }
+}
.container--estrutura .listContainer--Guias .listItem--renderGuia :global(.vtex-button) {
font-family: "Open Sans";
font-style: normal;
@@ -38,6 +43,18 @@
color: #bfbfbf;
text-transform: capitalize;
}
+@media (min-width: 2500px) {
+ .container--estrutura .listContainer--Guias .listItem--renderGuia :global(.vtex-button) {
+ font-size: 24px !important;
+ }
+}
+@media (max-width: 1024px) {
+ .container--estrutura .listContainer--Guias .listItem--renderGuia :global(.vtex-button) {
+ width: inherit;
+ display: flex;
+ justify-content: start;
+ }
+}
@media (max-width: 1024px) {
.container--estrutura .listContainer--Guias .listItem--renderGuia :global(.vtex-button__label) {
padding-left: 0;
diff --git a/styles/sass/pages/product/vtex.flex-layout.scss b/styles/sass/pages/product/vtex.flex-layout.scss
index c3eecc9..cf04caa 100644
--- a/styles/sass/pages/product/vtex.flex-layout.scss
+++ b/styles/sass/pages/product/vtex.flex-layout.scss
@@ -18,6 +18,9 @@
}
.flexRowContent--divProductIndisponivel {
gap: 32px;
+ @media (max-width: 1024px) {
+ flex-direction: column;
+ }
}
.flexColChild--info-availability {
.flexRow--divNomeProduct {
diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss
index 4d6ad1f..5b4a104 100644
--- a/styles/sass/pages/product/vtex.store-components.scss
+++ b/styles/sass/pages/product/vtex.store-components.scss
@@ -54,6 +54,46 @@
padding-top: 32px !important;
padding-bottom: 16px !important;
border: 0;
+ .form--newsletter {
+ min-width: 744px;
+ @media (max-width: 1024px) {
+ margin: 0;
+ width: 100%;
+ max-width: 100%;
+ padding: 0;
+ min-width: 265px;
+ }
+ .inputGroup--newsletter {
+ @media (max-width: 1024px) {
+ display: flex;
+ width: inherit;
+ justify-content: start;
+ align-items: baseline;
+ }
+ }
+ .label--newsletter {
+ font-family: "Open Sans";
+ font-style: normal;
+ font-weight: 400;
+ font-size: 24px;
+ line-height: 38px;
+ text-align: center;
+ color: #ffffff;
+ display: flex;
+ flex-direction: column;
+ min-width: 313px;
+ &::after {
+ content: "Receba ofertas e novidades por e-mail";
+ font-family: "Open Sans";
+ font-style: normal;
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 22px;
+ text-align: center;
+ color: #929292;
+ }
+ }
+ }
}
}
.buttonContainer--newsletter {
@@ -105,6 +145,9 @@
padding-top: 0 !important;
padding-bottom: 0 !important;
}
+// vtex-store-components-3-x-skuSelectorItem vtex-store-components-3-x-skuSelectorItem--divSku vtex-store-components-3-x-skuSelectorItem--34 vtex-store-components-3-x-skuSelectorItem--divSku--34 vtex-store-components-3-x-skuSelectorItem--selected vtex-store-components-3-x-skuSelectorItem--divSku--selected relative di pointer flex items-center outline-0 ma2
+
+// vtex-store-components-3-x-skuSelectorItem vtex-store-components-3-x-skuSelectorItem--divSku vtex-store-components-3-x-skuSelectorItem--34 vtex-store-components-3-x-skuSelectorItem--divSku--34 relative di pointer flex items-center outline-0 ma2
.skuSelectorContainer--divSku {
display: flex;
@@ -124,6 +167,19 @@
font-size: 14px;
}
}
+ .skuSelectorItem--divSku--selected {
+ .frameAround--divSku {
+ border: 3px solid black !important;
+ width: 52px !important;
+ height: 52px !important;
+ top: -2px !important;
+ left: -2px !important;
+ }
+ .diagonalCross--divSku {
+ color: $color-black !important;
+ border: 1px solid $color-black !important;
+ }
+ }
.skuSelectorItem--divSku {
width: 48px;
height: 48px;
@@ -172,19 +228,32 @@
font-size: 14px;
}
}
+ .skuSelectorItem--divSku--selected {
+ .frameAround--divSku {
+ border: 3px solid black !important;
+ }
+ .diagonalCross--divSku {
+ height: 40px;
+ width: 40px;
+ border-radius: 50%;
+ color: $color-black !important;
+ border: 1px solid $color-black !important;
+ transform: rotate(-90deg);
+ }
+ }
.skuSelectorItem--divSku {
width: 40px;
height: 40px;
+ border-radius: 50%;
.frameAround--divSku {
- border: 1px solid #989898;
border-radius: 50%;
- width: 40px;
- height: 40px;
+ border: 0.5px solid #989898;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
+
.skuSelectorInternalBox--divSku {
border-radius: 50%;
width: 40px;
@@ -206,6 +275,8 @@
height: 40px;
width: 40px;
border-radius: 50%;
+ color: #d5d5d5;
+ border: 1px solid #d5d5d5;
transform: rotate(-90deg);
}
}
@@ -217,6 +288,7 @@
transform: rotate(-90deg);
}
}
+
.shippingContainer {
display: flex;
position: relative;
@@ -419,24 +491,24 @@
.content {
display: grid;
grid-template-areas:
- "1"
- "2";
+ "name email"
+ "submit submit";
justify-content: inherit;
gap: 10px;
width: 100%;
max-width: 100%;
.inputName {
- grid-area: 1;
+ grid-area: name;
margin-right: 0;
margin-bottom: 0;
}
.inputEmail {
- grid-area: 1;
+ grid-area: email;
margin-right: 0;
margin-bottom: 0;
}
.submit {
- grid-area: 2;
+ grid-area: submit;
:global(.vtex-button) {
width: 100%;
height: 49px;
diff --git a/styles/sass/pages/product/vtex.tab-layout.scss b/styles/sass/pages/product/vtex.tab-layout.scss
index edb84d2..000d4bd 100644
--- a/styles/sass/pages/product/vtex.tab-layout.scss
+++ b/styles/sass/pages/product/vtex.tab-layout.scss
@@ -17,6 +17,9 @@
.listItem--renderGuia {
margin: 0;
padding: 0;
+ @media (max-width: 1024px) {
+ width: inherit;
+ }
:global(.vtex-button) {
font-family: "Open Sans";
font-style: normal;
@@ -25,6 +28,14 @@
line-height: 38px;
color: #bfbfbf;
text-transform: capitalize;
+ @media (min-width: 2500px) {
+ font-size: 24px !important;
+ }
+ @media (max-width: 1024px) {
+ width: inherit;
+ display: flex;
+ justify-content: start;
+ }
}
:global(.vtex-button__label) {
@media (max-width: 1024px) {