SavioCarvalhoMoraes/challenge-vtex-io-savio-carvalho-moraes
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feature/newsletter #21

Merged
SavioCarvalhoMoraes merged 2 commits from feature/newsletter into development 2023-02-10 14:31:59 +00:00
Conversation 0 Commits 2 Files Changed 4 +104 -166
4 changed files with 104 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
styles/css/vtex.flex-layout.css
View File

@ -25,8 +25,7 @@
.flexRowContent--cart { .flexRowContent--cart {
display: flex; display: flex;
justify-content: center; gap: 10px;
margin-bottom: 25px;
} }
.flexRowContent--cart .flexRow--buyButton :global(.vtex-button) { .flexRowContent--cart .flexRow--buyButton :global(.vtex-button) {
background-color: black; background-color: black;

130
styles/css/vtex.store-components.css
View File

@ -271,94 +271,64 @@
color: #929292; color: #929292;
} }
/*
.newsletter { .newsletter {
background: black; background: black;
border-bottom: 1px solid #ffffff; border-bottom: 1px solid #ffffff;
margin: 0; margin: 64px 0 0 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.container {
display: flex;
//height: 175px;
//padding: 0 0 0 0;
//background: black;
align-items: center;
justify-content: center;
.label {
display: flex;
flex-direction: column;
font-size: 0;
&::before {
content: "Assine nossa Newsletter";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 24px;
line-height: 38px;
text-align: center;
color: #ffffff;
}
&::after {
content: "Receba ofertas e novidades por e-mail";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 25px;
text-align: center;
color: #929292;
}
}
:global(.vtex-input-prefix__group) {
display: flex;
justify-content: center;
width: 774px;
border-top: none;
border-right: none;
border-left: none;
border-bottom: 1px solid #929292;
}
:global(.vtex-styleguide-9-x-input) {
background: transparent;
padding: 0 0 0 0;
}
:global(.vtex-button) {
position: relative;
left: 145px;
background: transparent;
border: none;
border-radius: 0;
border-bottom: 3px solid #bfbfbf;
&:hover {
border-bottom: 5px solid #bfbfbf;
}
:global(.vtex-button__label) {
font-family: "Open Sans";
font-style: normal;
font-weight: 700;
font-size: 14px;
line-height: 19px;
text-align: center;
color: #ffffff;
border: 1px solid #000000;
text-transform: uppercase;
}
}
}
} }
*/ .newsletter .container {
.newsletter { padding: 32px 0 16px 0;
background: black; }
border-bottom: 1px solid #ffffff; .newsletter .label {
margin: 0; font-size: 0;
}
.newsletter .label::before {
content: "Assine nossa newsletter";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 24px;
line-height: 38px;
color: #ffffff;
}
.newsletter .label::after {
content: "Receba ofertas e novidades por e-mail";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 25px;
text-align: center;
color: #929292;
}
.newsletter :global(.vtex-input-prefix__group) {
display: flex; display: flex;
flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; border-top: none;
border-right: none;
border-left: none;
border-bottom: 1px solid #929292;
border-radius: 0;
}
.newsletter :global(.vtex-styleguide-9-x-input) {
background: transparent;
padding: 0 0 0 0;
width: 774px;
}
.newsletter :global(.vtex-button) {
position: relative;
right: 40px;
background: transparent;
border: none;
border-radius: 0;
border-bottom: 3px solid #bfbfbf;
}
.newsletter :global(.vtex-button):hover {
border-bottom: 5px solid #bfbfbf;
} }
.label { .label {
@ -374,7 +344,7 @@
.label::after { .label::after {
content: "Receba ofertas e novidades por e-mail"; content: "Receba ofertas e novidades por e-mail";
font-family: sans-serif; font-family: "Open Sans";
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
font-size: 18px; font-size: 18px;
@ -388,7 +358,7 @@
} }
.productDescriptionTitle { .productDescriptionTitle {
font-family: sans-serif; font-family: "Open Sans";
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
font-size: 24px; font-size: 24px;

4
styles/sass/pages/product/vtex.flex-layout.scss
View File

@ -18,9 +18,7 @@
.flexRowContent--cart { .flexRowContent--cart {
display: flex; display: flex;
gap: 10px;
justify-content: center;
margin-bottom: 25px;
.flexRow--buyButton { .flexRow--buyButton {
:global(.vtex-button) { :global(.vtex-button) {
background-color: black; background-color: black;

133
styles/sass/pages/product/vtex.store-components.scss
View File

@ -170,9 +170,8 @@
right: 60px; right: 60px;
} }
.shippingTable { .shippingTable {
//display: grid;
border: none; border: none;
//flex-direction: column;
grid-template-columns: none !important; grid-template-columns: none !important;
} }
.shippingTableRow { .shippingTableRow {
@ -266,94 +265,66 @@
color: #929292; color: #929292;
} }
} }
/*
.newsletter { .newsletter {
background: black; background: black;
border-bottom: 1px solid #ffffff; border-bottom: 1px solid #ffffff;
margin: 0; margin: 64px 0 0 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.container { .container {
display: flex; padding: 32px 0 16px 0;
//height: 175px; }
//padding: 0 0 0 0; .label {
//background: black; font-size: 0;
align-items: center; &::before {
justify-content: center; content: "Assine nossa newsletter";
.label { font-family: "Open Sans";
display: flex; font-style: normal;
flex-direction: column; font-weight: 400;
font-size: 0; font-size: 24px;
&::before { line-height: 38px;
content: "Assine nossa Newsletter";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 24px;
line-height: 38px;
text-align: center;
color: #ffffff;
}
&::after {
content: "Receba ofertas e novidades por e-mail";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 25px;
text-align: center;
color: #929292;
}
}
:global(.vtex-input-prefix__group) {
display: flex;
justify-content: center;
width: 774px;
border-top: none;
border-right: none;
border-left: none;
border-bottom: 1px solid #929292;
}
:global(.vtex-styleguide-9-x-input) {
background: transparent;
padding: 0 0 0 0;
}
:global(.vtex-button) {
position: relative;
left: 145px;
background: transparent;
border: none;
border-radius: 0;
border-bottom: 3px solid #bfbfbf;
&:hover {
border-bottom: 5px solid #bfbfbf;
}
:global(.vtex-button__label) { color: #ffffff;
font-family: "Open Sans"; }
font-style: normal; &::after {
font-weight: 700; content: "Receba ofertas e novidades por e-mail";
font-size: 14px; font-family: "Open Sans";
line-height: 19px; font-style: normal;
text-align: center; font-weight: 400;
color: #ffffff; font-size: 18px;
border: 1px solid #000000; line-height: 25px;
text-transform: uppercase; text-align: center;
} color: #929292;
}
}
:global(.vtex-input-prefix__group) {
display: flex;
justify-content: center;
border-top: none;
border-right: none;
border-left: none;
border-bottom: 1px solid #929292;
border-radius: 0;
}
:global(.vtex-styleguide-9-x-input) {
background: transparent;
padding: 0 0 0 0;
width: 774px;
}
:global(.vtex-button) {
position: relative;
right: 40px;
background: transparent;
border: none;
border-radius: 0;
border-bottom: 3px solid #bfbfbf;
&:hover {
border-bottom: 5px solid #bfbfbf;
} }
} }
}
*/
.newsletter {
background: black;
border-bottom: 1px solid #ffffff;
margin: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
} }
.label { .label {
font-family: "Open Sans"; font-family: "Open Sans";
@ -367,7 +338,7 @@
} }
.label::after { .label::after {
content: "Receba ofertas e novidades por e-mail"; content: "Receba ofertas e novidades por e-mail";
font-family: sans-serif; font-family: "Open Sans";
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
font-size: 18px; font-size: 18px;
@ -381,7 +352,7 @@
} }
.productDescriptionTitle { .productDescriptionTitle {
font-family: sans-serif; font-family: "Open Sans";
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
font-size: 24px; font-size: 24px;