feat: adiciona newsletter 1440px

This commit is contained in:
Rafael Sampaio de Oliveira 2023-01-31 15:29:39 -03:00
parent c687b36418
commit d1992a1fee
5 changed files with 159 additions and 11 deletions

View File

@ -10,6 +10,7 @@
// "shelf.relatedProducts", // "shelf.relatedProducts",
"rich-text#shelfTitle", "rich-text#shelfTitle",
"list-context.product-list#shelfProducts", "list-context.product-list#shelfProducts",
"newsletter#pageProduct",
"product-questions-and-answers" "product-questions-and-answers"
] ]
}, },
@ -253,5 +254,12 @@
"list-context.product-list#shelfProducts": { "list-context.product-list#shelfProducts": {
"blocks": ["product-summary.shelf#shelfProducts"], "blocks": ["product-summary.shelf#shelfProducts"],
"children": ["slider-layout#demo-products"] "children": ["slider-layout#demo-products"]
},
"newsletter#pageProduct": {
"props": {
"blockClass": "pageProduct",
"label": "Assine nossa newsletter",
"placeholder": "Digite seu e-mail"
}
} }
} }

View File

@ -140,7 +140,7 @@
position: absolute; position: absolute;
left: 232px; left: 232px;
top: 33%; top: 33%;
background: #292929; background: #000000;
border: none; border: none;
border-radius: 0; border-radius: 0;
} }
@ -169,7 +169,7 @@
visibility: visible; visibility: visible;
content: "Não sei meu CEP"; content: "Não sei meu CEP";
font-size: 12px; font-size: 12px;
color: #292929; color: #000000;
text-decoration-line: underline; text-decoration-line: underline;
} }
@ -198,7 +198,7 @@
content: "Entrega"; content: "Entrega";
text-transform: uppercase; text-transform: uppercase;
display: block; display: block;
color: #292929; color: #000000;
} }
.shippingTableHeadDeliveryEstimate { .shippingTableHeadDeliveryEstimate {
@ -215,7 +215,7 @@
content: "Prazo"; content: "Prazo";
text-transform: uppercase; text-transform: uppercase;
display: block; display: block;
color: #292929; color: #000000;
} }
.shippingTableHeadDeliveryPrice { .shippingTableHeadDeliveryPrice {
@ -232,7 +232,7 @@
content: "Frete"; content: "Frete";
text-transform: uppercase; text-transform: uppercase;
display: block; display: block;
color: #292929; color: #000000;
} }
.shippingTableRadioBtn { .shippingTableRadioBtn {
@ -285,5 +285,70 @@
font-weight: 700; font-weight: 700;
font-size: 24px; font-size: 24px;
line-height: 33px; line-height: 33px;
color: #292929; color: #000000;
}
.newsletter--pageProduct {
height: 175px;
margin: 64px 0 32px 0;
background: #000000;
display: flex;
}
.container--pageProduct {
padding: 0;
padding-top: 32px;
width: 53.75%;
max-width: unset;
}
.form--pageProduct {
max-width: unset;
}
.label--pageProduct {
display: flex;
flex-direction: column;
gap: 16px;
font-style: normal;
font-weight: 400;
font-size: 24px;
line-height: 38px;
color: #fff;
}
.label--pageProduct::after {
content: "Receba ofertas e novidades por e-mail";
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 25px;
color: #929292;
}
.buttonContainer--pageProduct {
padding: 0;
}
.buttonContainer--pageProduct :global(.vtex-button) {
border: none;
border-bottom: 4px solid #ffffff;
border-radius: 0;
background: transparent;
font-style: normal;
font-weight: 700;
font-size: 14px;
line-height: 19px;
color: #fff;
}
.inputGroup--pageProduct :global(.vtex-input-prefix__group) {
border: none;
border-radius: 0;
border-bottom: 1px solid #ffffff;
}
.inputGroup--pageProduct :global(.vtex-styleguide-9-x-input) {
background: transparent;
padding: 0;
} }

View File

@ -1,4 +1,13 @@
.hideDecorators { /*
border-left: 0; 0 - 600PX: Phone
border-right: 0; 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 */
.input {
border: none;
}

View File

@ -287,3 +287,68 @@
line-height: 33px; line-height: 33px;
color: $color-black; color: $color-black;
} }
.newsletter--pageProduct {
height: 175px;
margin: 64px 0 32px 0;
background: $color-black;
display: flex;
}
.container--pageProduct {
padding: 0;
padding-top: 32px;
width: 53.75%;
max-width: unset;
}
.form--pageProduct {
max-width: unset;
}
.label--pageProduct {
display: flex;
flex-direction: column;
gap: 16px;
font-style: normal;
font-weight: 400;
font-size: 24px;
line-height: 38px;
color: $color-white;
}
.label--pageProduct::after {
content: "Receba ofertas e novidades por e-mail";
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 25px;
color: $color-gray7;
}
.buttonContainer--pageProduct {
padding: 0;
}
.buttonContainer--pageProduct :global(.vtex-button) {
border: none;
border-bottom: 4px solid $color-gray11;
border-radius: 0;
background: transparent;
font-style: normal;
font-weight: 700;
font-size: 14px;
line-height: 19px;
color: $color-white;
}
.inputGroup--pageProduct :global(.vtex-input-prefix__group) {
border: none;
border-radius: 0;
border-bottom: 1px solid $color-gray11;
}
.inputGroup--pageProduct :global(.vtex-styleguide-9-x-input) {
background: transparent;
padding: 0;
}

View File

@ -1,6 +1,6 @@
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap%27"); @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap%27");
$color-black: #292929; $color-black: #000000;
$color-white: #fff; $color-white: #fff;
@ -14,6 +14,7 @@ $color-gray7: #929292;
$color-gray8: #575757; $color-gray8: #575757;
$color-gray9: #afafaf; $color-gray9: #afafaf;
$color-gray10: #bfbfbf; $color-gray10: #bfbfbf;
$color-gray11: #ffffff;
$color-blue: #4267b2; $color-blue: #4267b2;