diff --git a/react/Installments.tsx b/react/Installments.tsx
deleted file mode 100644
index 37b09f1..0000000
--- a/react/Installments.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-import { Installments } from "./components/installments";
-
-export default Installments;
diff --git a/react/components/descont-pix/index.tsx b/react/components/descont-pix/index.tsx
index ef6c288..d78e7a3 100644
--- a/react/components/descont-pix/index.tsx
+++ b/react/components/descont-pix/index.tsx
@@ -5,7 +5,7 @@ import styles from "./styles.css";
export const DescontPix: FC = () => {
const productContextValue = useProduct();
-
+ console.log(productContextValue);
// const fetchApi = async () => {
// fetch("/api/checkout/pub/orderForms/simulation", {
// method: "POST",
diff --git a/react/components/installments/index.tsx b/react/components/installments/index.tsx
deleted file mode 100644
index 9ba7546..0000000
--- a/react/components/installments/index.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import React, { FC } from 'react'
-import { useProduct } from 'vtex.product-context'
-import styles from "./styles.css";
-
-export const Installments: FC = () => {
-
- const productContextValue = useProduct();
-
- let sellingPrice = Number(productContextValue?.product?.priceRange.sellingPrice.highPrice)/4;
-
- return (
-
- 4 x de R$ {sellingPrice.toFixed(2).replace(".", ",")} sem juros
-
- );
-}
diff --git a/react/components/installments/styles.css b/react/components/installments/styles.css
deleted file mode 100644
index 5d7eba2..0000000
--- a/react/components/installments/styles.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.sellingPrice{
- font-weight: 400;
- font-size: 16px;
- line-height: 22px;
- color: #929292;
-}
-
-.sellingPriceBold{
- font-weight: 700;
-}
diff --git a/store/blocks/header/header.jsonc b/store/blocks/header/header.jsonc
index ab2c0c0..70159a6 100644
--- a/store/blocks/header/header.jsonc
+++ b/store/blocks/header/header.jsonc
@@ -7,19 +7,34 @@
},
"header-layout.desktop": {
"children": [
- "flex-layout.row#1-desktop",
- "flex-layout.row#3-desktop",
+ "flex-layout.row#top-menu-descont",
"sticky-layout#4-desktop"
]
},
+ "flex-layout.row#top-menu-descont":{
+ "props": {
+ "blockClass": "container-top-menu-descont"
+ },
+ "children": [
+ "rich-text#text-top-menu-descont"
+ ]
+ },
+
+ "rich-text#text-top-menu-descont": {
+ "props": {
+ "text": "Desconto na primeira compra",
+ "blockClass": "text-top-menu-descont"
+ }
+ },
+
"flex-layout.row#1-desktop": {
"children": ["telemarketing"],
"props": {
"fullWidth": true
}
},
-
+
"flex-layout.row#3-desktop": {
"props": {
"blockClass": "menu-link",
@@ -57,47 +72,69 @@
"children": [
"flex-layout.col#logo-desktop",
"flex-layout.col#category-menu",
- "flex-layout.col#spacer",
+ // "flex-layout.col#spacer",
"search-bar",
- "locale-switcher",
- "login",
- "minicart.v2"
+ "flex-layout.row#login-and-cart"
]
},
+
+ "search-bar":{
+ "props": {
+ "placeholder": "Faça sua busca"
+ }
+ },
+
"flex-layout.col#logo-desktop": {
"props": {
- "verticalAlign": "middle"
+ "verticalAlign": "middle",
+ "blockClass": "logo-desktop-m3academy"
},
"children": ["logo#desktop"]
},
"flex-layout.col#category-menu": {
"props": {
- "verticalAlign": "middle"
+ "verticalAlign": "middle",
+ "blockClass": "menu-header-container"
},
"children": ["vtex.menu@2.x:menu#category-menu"]
},
"logo#desktop": {
"props": {
- "title": "Logo",
+ "title": "Logo M3 Academy",
"href": "/",
- "url": "https://storecomponents.vteximg.com.br/arquivos/store-theme-logo.png",
- "width": "180",
- "height": "12"
+ "url": "https://agenciamagma.vteximg.com.br/arquivos/LogoM3Academy.png",
+ "width": "100%",
+ "height": "auto"
}
},
"header-layout.mobile": {
- "children": ["sticky-layout#1-mobile"]
+ "children": [
+ "flex-layout.row#top-menu-descont",
+ "sticky-layout#1-mobile"
+ ],
+ "props": {
+ "sticky": false
+ }
},
"sticky-layout#1-mobile": {
- "children": ["flex-layout.row#1-mobile"]
+ "children": ["flex-layout.row#mobile-header-col"]
},
+
+ "flex-layout.row#mobile-header-col": {
+ "children": [
+ "flex-layout.row#1-mobile",
+ "search-bar#mobile"
+ ],
+ "props": {
+ "blockClass": "mobile-header-col"
+ }
+ },
+
"flex-layout.row#1-mobile": {
"children": [
"drawer",
"logo#mobile",
- "flex-layout.col#spacer",
- "login",
- "minicart.v2"
+ "flex-layout.row#login-and-cart"
],
"props": {
"blockClass": "main-header-mobile",
@@ -106,8 +143,22 @@
"fullWidth": true
}
},
+
+ "flex-layout.row#login-and-cart":{
+ "children": [
+ "login",
+ "minicart.v2"
+ ],
+ "props": {
+ "blockClass": "login-and-cart-container"
+ }
+ },
+
"drawer": {
- "children": ["menu#drawer"]
+ "children": ["menu#drawer"],
+ "props": {
+ "blockClass": "drawer-header"
+ }
},
"menu#drawer": {
@@ -125,9 +176,16 @@
"props": {
"title": "Logo",
"href": "/",
- "url": "https://storecomponents.vteximg.com.br/arquivos/store-theme-logo-mobile.png",
- "width": "77.5",
- "height": "27.5"
+ "url": "https://agenciamagma.vteximg.com.br/arquivos/LogoM3Academy.png",
+ "width": "140",
+ "height": "33",
+ "blockClass": "logo-mobile-header"
+ }
+ },
+
+ "search-bar#mobile": {
+ "props": {
+ "blockClass": "search-mobile-header"
}
}
}
diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index 1f45afa..2d41dfe 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -49,6 +49,7 @@
"product-images#description": {
"props":{
"displayMode": "first-image",
+ "zoomMode": "disabled",
"blockClass": "image-description-pdp"
}
},
@@ -188,18 +189,27 @@
"itemsPerPage": {
"desktop": 4,
"tablet": 3,
- "phone": 2
+ "mobile": 2
}
}
},
+ "html#related-products-testid": {
+ "props": {
+ "testId": "vtex-product-summary"
+ },
+ "children": [
+ "rich-text#title-related-products",
+ "list-context.product-list#related-products-pdp"
+ ]
+ },
+
"flex-layout.row#related-products-pdp":{
"props": {
"blockClass": "container-related-products-pdp"
},
"children": [
- "rich-text#title-related-products",
- "list-context.product-list#related-products-pdp"
+ "html#related-products-testid"
]
},
@@ -302,7 +312,7 @@
"flex-layout.row#product-name",
"product-identifier.product",
"flex-layout.row#selling-price",
- "installments",
+ "product-installments#m3",
"html#descont-pix",
"html#sku-selector",
"flex-layout.row#quantity-and-buy-button",
@@ -311,6 +321,18 @@
]
},
+ "product-installments#m3": {
+ "props": {
+ "markers": ["discount"],
+ "installmentOptionsFilter": {
+ "paymentSystemName": "Mastercard",
+ "installmentsQuantity": 4
+ },
+ "blockClass": "m3-custom-installments",
+ "message": "{installmentsNumber} x de {installmentValue} sem juros"
+ }
+ },
+
"html#descont-pix":{
"props": {
"testId": "pix-price"
diff --git a/store/interfaces.json b/store/interfaces.json
index eae6eb8..5092039 100644
--- a/store/interfaces.json
+++ b/store/interfaces.json
@@ -2,9 +2,6 @@
"example-component": {
"component": "Example"
},
- "installments": {
- "component": "Installments"
- },
"descont-pix": {
"component": "DescontPix"
},
diff --git a/styles/configs/style.json b/styles/configs/style.json
index f486303..0b02dac 100644
--- a/styles/configs/style.json
+++ b/styles/configs/style.json
@@ -4,14 +4,14 @@
],
"spacing": [0.125, 0.25, 0.5, 0.75, 1, 1.5, 2, 3, 4, 8, 16],
"customMedia": [
- { "s": 20 },
+ { "s": 48 },
{ "ns": {
- "value": 40,
+ "value": 48,
"minWidth": true
}
},
{ "m": {
- "value": 40,
+ "value": 48,
"minWidth": true
}
},
diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css
index c25d216..27b3623 100644
--- a/styles/css/vtex.flex-layout.css
+++ b/styles/css/vtex.flex-layout.css
@@ -8,6 +8,45 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
+.flexRowContent--main-header {
+ padding: 24.5px 40px !important;
+ justify-content: space-between;
+}
+.flexRowContent--main-header .flexCol--logo-desktop-m3academy {
+ width: 44.8717%;
+}
+.flexRowContent--main-header .flexCol--logo-desktop-m3academy :global(.vtex-store-components-3-x-logoContainer) {
+ max-width: 100%;
+ max-height: 100%;
+ min-width: auto;
+ padding: 0;
+}
+
+.flexRowContent--main-header-mobile {
+ justify-content: space-between;
+}
+
+.flexRowContent--mobile-header-col {
+ padding: 32px 40px;
+ flex-direction: column;
+ row-gap: 8px;
+}
+.flexRowContent--mobile-header-col .stretchChildrenWidth {
+ width: 100% !important;
+}
+.flexRowContent--mobile-header-col :global(.vtex-store-components-3-x-searchBarContainer) {
+ max-width: 100%;
+}
+
+.flexRowContent--login-and-cart-container {
+ gap: 40px;
+}
+
+@media screen and (min-width: 1920px) {
+ .flexRowContent--main-header {
+ padding: 24.5px 360px !important;
+ }
+}
.flexRow--container-product-main {
padding: 0 40px;
}
diff --git a/styles/css/vtex.login.css b/styles/css/vtex.login.css
new file mode 100644
index 0000000..7bfe701
--- /dev/null
+++ b/styles/css/vtex.login.css
@@ -0,0 +1,32 @@
+/*
+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 */
+/* Grid breakpoints */
+.container {
+ height: min-content;
+ align-self: flex-end;
+ padding: 3px 0px;
+}
+.container :global(.vtex-button) {
+ border: 0;
+}
+.container :global(.vtex-button):hover {
+ background: transparent;
+}
+.container :global(.vtex-button) :global(.vtex-button__label) {
+ padding: 0 !important;
+ padding-left: 4px !important;
+}
+
+.label {
+ font-size: 0;
+ padding: 0;
+}
+.label::after {
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/loginChallegeVtexT4.svg");
+}
\ No newline at end of file
diff --git a/styles/css/vtex.menu.css b/styles/css/vtex.menu.css
new file mode 100644
index 0000000..fd7b46f
--- /dev/null
+++ b/styles/css/vtex.menu.css
@@ -0,0 +1,25 @@
+/*
+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 */
+/* Grid breakpoints */
+:global(.vtex-menu-2-x-styledLink) {
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 16px;
+ letter-spacing: -0.1em;
+ text-transform: uppercase;
+ color: #929292;
+}
+
+:global(.vtex-menu-2-x-styledLinkContainer) {
+ margin: 0;
+}
+
+:global(.vtex-menu-2-x-menuContainer) {
+ gap: 15px;
+}
\ No newline at end of file
diff --git a/styles/css/vtex.minicart.css b/styles/css/vtex.minicart.css
new file mode 100644
index 0000000..059e3da
--- /dev/null
+++ b/styles/css/vtex.minicart.css
@@ -0,0 +1,31 @@
+/*
+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 */
+/* Grid breakpoints */
+.minicartContainer {
+ align-self: flex-end;
+ padding: 3px 0;
+}
+.minicartContainer .openIconContainer {
+ padding: 0;
+}
+.minicartContainer .openIconContainer :global(.vtex-minicart-2-x-cartIcon) {
+ display: none;
+}
+.minicartContainer .openIconContainer .minicartIconContainer::after {
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/cartChallegeVtexT4.svg");
+}
+.minicartContainer .openIconContainer :global(.vtex-button) {
+ border: 0;
+}
+.minicartContainer .openIconContainer :global(.vtex-button):hover {
+ background: transparent;
+}
+.minicartContainer .openIconContainer :global(.vtex-button) :global(.vtex-button__label) {
+ padding: 0 !important;
+}
\ No newline at end of file
diff --git a/styles/css/vtex.product-price.css b/styles/css/vtex.product-price.css
index cc015d0..eb058b7 100644
--- a/styles/css/vtex.product-price.css
+++ b/styles/css/vtex.product-price.css
@@ -19,4 +19,17 @@
font-size: 16px;
line-height: 22px;
color: #929292;
+}
+
+.installments--m3-custom-installments .installments-discount--m3-custom-installments {
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 22px;
+ color: #929292;
+}
+.installments--m3-custom-installments .currencyContainer--m3-custom-installments {
+ font-weight: 700;
+ font-size: 16px;
+ line-height: 22px;
+ color: #929292;
}
\ No newline at end of file
diff --git a/styles/css/vtex.rich-text.css b/styles/css/vtex.rich-text.css
index ae08726..e52c13d 100644
--- a/styles/css/vtex.rich-text.css
+++ b/styles/css/vtex.rich-text.css
@@ -7,6 +7,31 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
+.container--text-top-menu-descont {
+ justify-content: center;
+ background-color: #000000;
+}
+
+.paragraph--text-top-menu-descont {
+ display: flex;
+ margin: 0;
+ padding: 10px 0;
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+ color: #FFFFFF;
+}
+.paragraph--text-top-menu-descont::after {
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/arrowRightWhiteChalengeVtex.svg");
+ margin-left: 54px;
+ height: 14px;
+}
+.paragraph--text-top-menu-descont::before {
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/arrowLeftWhiteChalengeVtex.svg");
+ margin-right: 54px;
+ height: 14px;
+}
+
.container--title-related-products {
justify-content: center;
margin-top: 16px;
diff --git a/styles/css/vtex.sticky-layout.css b/styles/css/vtex.sticky-layout.css
index e69de29..adeca97 100644
--- a/styles/css/vtex.sticky-layout.css
+++ b/styles/css/vtex.sticky-layout.css
@@ -0,0 +1,16 @@
+/*
+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 */
+/* Grid breakpoints */
+.wrapper--sticky-header {
+ background-color: #ffffff !important;
+}
+
+.wrapper--stuck .container {
+ position: relative !important;
+}
\ No newline at end of file
diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css
index c981d28..8a98a83 100644
--- a/styles/css/vtex.store-components.css
+++ b/styles/css/vtex.store-components.css
@@ -8,6 +8,43 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
+.searchBarContainer {
+ padding: 0;
+ align-self: center;
+}
+.searchBarContainer :global(.vtex-input-prefix__group) {
+ display: flex;
+ flex-direction: row-reverse;
+ border: 0;
+ border-radius: 0;
+ border-bottom: 1px solid #AEAEAE;
+ height: auto;
+}
+.searchBarContainer :global(.vtex-input-prefix__group) :global(.vtex-styleguide-9-x-input) {
+ font-weight: 300;
+ font-size: 12px;
+ line-height: 16px;
+ color: #AEAEAE;
+ border: 0;
+ padding: 0;
+ background: transparent;
+ padding-bottom: 8px;
+}
+.searchBarContainer :global(.vtex-input-prefix__group) :global(.vtex-input__suffix) {
+ padding: 0;
+ padding-bottom: 8px;
+ background: transparent;
+}
+.searchBarContainer :global(.vtex-input-prefix__group) :global(.vtex-input__suffix) :global(.vtex-store-components-3-x-searchBarIcon--search) {
+ padding-right: 12px;
+}
+.searchBarContainer :global(.vtex-input-prefix__group) :global(.vtex-input__suffix) :global(.vtex-store-components-3-x-searchBarIcon--search)::after {
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/searchChallengeVtexT4.svg");
+}
+.searchBarContainer :global(.vtex-input-prefix__group) :global(.vtex-input__suffix) :global(.vtex-store-components-3-x-searchIcon) {
+ display: none;
+}
+
.newsletter {
background: red;
}
@@ -363,4 +400,12 @@
.carouselGaleryThumbs--product-images-pdp {
display: block !important;
}
+}
+@media screen and (max-width: 416px) {
+ .shippingTable {
+ width: 100%;
+ }
+ .shippingTable .shippingTableBody .shippingTableRow {
+ align-items: center;
+ }
}
\ No newline at end of file
diff --git a/styles/css/vtex-store-components-3.css b/styles/css/vtex.store-drawer.css
similarity index 52%
rename from styles/css/vtex-store-components-3.css
rename to styles/css/vtex.store-drawer.css
index 3afa73c..e01aebf 100644
--- a/styles/css/vtex-store-components-3.css
+++ b/styles/css/vtex.store-drawer.css
@@ -7,8 +7,12 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
-.container {
- margin: 0;
+.openIconContainer {
padding: 0;
- max-width: max-content;
+}
+.openIconContainer .menuIcon {
+ display: none;
+}
+.openIconContainer::after {
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/drawerChallegeVtexT4.svg");
}
\ No newline at end of file
diff --git a/styles/sass/pages/header/vtex.flex-layout.scss b/styles/sass/pages/header/vtex.flex-layout.scss
new file mode 100644
index 0000000..2dfa7c6
--- /dev/null
+++ b/styles/sass/pages/header/vtex.flex-layout.scss
@@ -0,0 +1,44 @@
+.flexRowContent--main-header{
+ padding: 24.5px 40px !important;
+ justify-content: space-between;
+
+ .flexCol--logo-desktop-m3academy{
+ width: 44.8717%;
+
+ :global(.vtex-store-components-3-x-logoContainer){
+ max-width: 100%;
+ max-height: 100%;
+ min-width: auto;
+ padding: 0;
+ }
+ }
+}
+
+.flexRowContent--main-header-mobile{
+justify-content: space-between;
+}
+
+.flexRowContent--mobile-header-col{
+ padding: 32px 40px;
+
+ flex-direction: column;
+ row-gap: 8px;
+
+ .stretchChildrenWidth{
+ width: 100% !important;
+ }
+
+ :global(.vtex-store-components-3-x-searchBarContainer){
+ max-width: 100%;
+ }
+}
+
+.flexRowContent--login-and-cart-container{
+ gap: 40px;
+}
+
+@media screen and (min-width: 1920px) {
+ .flexRowContent--main-header{
+ padding: 24.5px 360px !important;
+ }
+}
diff --git a/styles/sass/pages/header/vtex.login.scss b/styles/sass/pages/header/vtex.login.scss
new file mode 100644
index 0000000..c5f656d
--- /dev/null
+++ b/styles/sass/pages/header/vtex.login.scss
@@ -0,0 +1,27 @@
+.container{
+ height: min-content;
+ align-self: flex-end;
+ padding: 3px 0px;
+
+ :global(.vtex-button){
+ border: 0;
+
+ &:hover{
+ background: transparent;
+ }
+
+ :global(.vtex-button__label){
+ padding: 0 !important;
+ padding-left: 4px !important;
+ }
+ }
+}
+
+.label{
+ font-size: 0;
+ padding: 0;
+
+ &::after{
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/loginChallegeVtexT4.svg");
+ }
+}
diff --git a/styles/sass/pages/header/vtex.menu.scss b/styles/sass/pages/header/vtex.menu.scss
new file mode 100644
index 0000000..e1e2bad
--- /dev/null
+++ b/styles/sass/pages/header/vtex.menu.scss
@@ -0,0 +1,17 @@
+:global(.vtex-menu-2-x-styledLink){
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 16px;
+ letter-spacing: -0.1em;
+ text-transform: uppercase;
+
+ color: #929292;
+}
+
+:global(.vtex-menu-2-x-styledLinkContainer){
+ margin: 0;
+}
+
+:global(.vtex-menu-2-x-menuContainer){
+ gap: 15px;
+}
diff --git a/styles/sass/pages/header/vtex.minicart.scss b/styles/sass/pages/header/vtex.minicart.scss
new file mode 100644
index 0000000..2130e5a
--- /dev/null
+++ b/styles/sass/pages/header/vtex.minicart.scss
@@ -0,0 +1,29 @@
+.minicartContainer{
+ align-self: flex-end;
+ padding: 3px 0;
+ .openIconContainer{
+ padding: 0;
+
+ :global(.vtex-minicart-2-x-cartIcon){
+ display: none;
+ }
+
+ .minicartIconContainer{
+ &::after{
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/cartChallegeVtexT4.svg");
+ }
+ }
+
+ :global(.vtex-button){
+ border: 0;
+
+ &:hover{
+ background: transparent;
+ }
+
+ :global(.vtex-button__label){
+ padding: 0 !important;
+ }
+ }
+ }
+}
diff --git a/styles/sass/pages/header/vtex.rich-text.scss b/styles/sass/pages/header/vtex.rich-text.scss
new file mode 100644
index 0000000..3f08016
--- /dev/null
+++ b/styles/sass/pages/header/vtex.rich-text.scss
@@ -0,0 +1,29 @@
+.container--text-top-menu-descont{
+ justify-content: center;
+ background-color: #000000;
+}
+
+.paragraph--text-top-menu-descont{
+ display: flex;
+ margin: 0;
+ padding: 10px 0;
+
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+
+
+ color: #FFFFFF;
+
+ &::after{
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/arrowRightWhiteChalengeVtex.svg");
+ margin-left: 54px;
+ height: 14px;
+ }
+
+ &::before{
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/arrowLeftWhiteChalengeVtex.svg");
+ margin-right: 54px;
+ height: 14px;
+ }
+}
diff --git a/styles/sass/pages/header/vtex.sticky-layout.scss b/styles/sass/pages/header/vtex.sticky-layout.scss
new file mode 100644
index 0000000..fdd20a6
--- /dev/null
+++ b/styles/sass/pages/header/vtex.sticky-layout.scss
@@ -0,0 +1,9 @@
+.wrapper--sticky-header {
+ background-color: #ffffff !important;
+}
+
+.wrapper--stuck{
+ .container{
+ position: relative !important;
+ }
+}
diff --git a/styles/sass/pages/header/vtex.store-components.scss b/styles/sass/pages/header/vtex.store-components.scss
new file mode 100644
index 0000000..26c0033
--- /dev/null
+++ b/styles/sass/pages/header/vtex.store-components.scss
@@ -0,0 +1,46 @@
+.searchBarContainer{
+ padding: 0;
+ align-self: center;
+
+ :global(.vtex-input-prefix__group){
+ display: flex;
+ flex-direction: row-reverse;
+
+ border: 0;
+ border-radius: 0;
+ border-bottom: 1px solid #AEAEAE;
+
+ height: auto;
+
+ :global(.vtex-styleguide-9-x-input){
+
+ font-weight: 300;
+ font-size: 12px;
+ line-height: 16px;
+ color: #AEAEAE;
+ border: 0;
+ padding: 0;
+
+ background: transparent;
+
+ padding-bottom: 8px;
+ }
+
+ :global(.vtex-input__suffix){
+ padding: 0;
+ padding-bottom: 8px;
+ background: transparent;
+ :global(.vtex-store-components-3-x-searchBarIcon--search){
+
+ padding-right: 12px;
+ &::after{
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/searchChallengeVtexT4.svg");
+ }
+ }
+
+ :global(.vtex-store-components-3-x-searchIcon){
+ display: none;
+ }
+ }
+ }
+}
diff --git a/styles/sass/pages/header/vtex.store-drawer.scss b/styles/sass/pages/header/vtex.store-drawer.scss
new file mode 100644
index 0000000..b6c8431
--- /dev/null
+++ b/styles/sass/pages/header/vtex.store-drawer.scss
@@ -0,0 +1,12 @@
+.openIconContainer{
+
+ padding: 0;
+
+ .menuIcon{
+ display: none;
+ }
+
+ &::after{
+ content: url("https://agenciamagma.vteximg.com.br/arquivos/drawerChallegeVtexT4.svg");
+ }
+}
diff --git a/styles/sass/pages/product/vtex.product-price.scss b/styles/sass/pages/product/vtex.product-price.scss
index 7870d4e..900a12d 100644
--- a/styles/sass/pages/product/vtex.product-price.scss
+++ b/styles/sass/pages/product/vtex.product-price.scss
@@ -11,3 +11,19 @@
line-height: 22px;
color: #929292;
}
+
+.installments--m3-custom-installments{
+ .installments-discount--m3-custom-installments{
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 22px;
+ color: #929292;
+ }
+
+ .currencyContainer--m3-custom-installments{
+ font-weight: 700;
+ font-size: 16px;
+ line-height: 22px;
+ color: #929292;
+ }
+}
diff --git a/styles/sass/pages/product/vtex.slider-layout.scss b/styles/sass/pages/product/vtex.slider-layout.scss
index 137edb4..eb8cc72 100644
--- a/styles/sass/pages/product/vtex.slider-layout.scss
+++ b/styles/sass/pages/product/vtex.slider-layout.scss
@@ -68,9 +68,5 @@
right: -20px;
}
}
-
- // .sliderTrack--container-slider-related-products-pdp{
- // width: 700% !important;
- // }
-
}
+
diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss
index 246e15f..351c927 100644
--- a/styles/sass/pages/product/vtex.store-components.scss
+++ b/styles/sass/pages/product/vtex.store-components.scss
@@ -425,3 +425,14 @@
display: block !important;
}
}
+
+@media screen and (max-width: 416px) {
+ .shippingTable {
+ width: 100%;
+ .shippingTableBody{
+ .shippingTableRow{
+ align-items: center;
+ }
+ }
+ }
+}