Douglas-Vinicius-Nobrega/m3-academy-template-checkout-Douglas-Nobrega
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feature(finalizandar-compra) Tela de finalização de compra concluida

Browse Source
This commit is contained in:
Douglas Vinicius Nobrega 2022-12-18 18:28:14 -03:00
parent e3744ee00f
commit 79f14a38a0
4 changed files with 130 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
checkout/src/arquivos/js/components/Footer.js
View File

@ -13,7 +13,6 @@ export default class Footer {
this.footerPrateleira = await waitElement(".footerCheckout__prateleira");
this.apiPrateleira();
await this.addCarrossel();
this.payments();
this.iconVtex();
this.developBy();
@ -84,6 +83,9 @@ export default class Footer {
`;
});
});
//.then(() => {
//this.addCarrossel();
//});
}
async addCarrossel() {

102
checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss
View File

@ -1,4 +1,20 @@
.checkout-container {
.checkbox {
input {
border: 1px solid $color-border-radius-figma-2 !important;
border-radius: 3px !important;
}
span {
font-family: $font-family;
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 16px;
color: $color-figma-gray-medium;
}
}
.client-pre-email {
border-color: $color-gray4;
font-family: $font-family;
@ -46,6 +62,20 @@
.client-email {
margin: 0 0 16px;
label {
font-size: 0px;
&:before {
content: "Email";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: $color-gray2;
}
}
input {
font-size: 12px;
font-weight: 400;
@ -150,20 +180,39 @@
}
}
.client-profile-data {
.accordion-heading {
.accordion-toggle {
display: none !important;
}
}
}
.shipping-data,
.payment-data,
.client-profile-data {
.accordion-group {
border-radius: 0;
border: 1px solid $color-gray4;
border: 1px solid $color-gray3;
border-radius: 8px;
font-family: $font-family;
padding: 16px;
padding: 24px 17px 44px 17px;
.accordion-heading {
span {
color: #303030;
margin-bottom: 8px;
padding: 0;
font-family: $font-family-secundary;
display: flex;
flex-direction: row-reverse;
align-items: center;
justify-content: space-between;
i {
background-image: url("../lapisM3Academy.png");
}
i::before {
fill: #303030;
@ -185,22 +234,47 @@
.accordion-inner {
padding: 0;
.shipping-summary-info,
.notification {
font-family: $font-family;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: $color-gray2;
}
/* General configurations */
.client-notice {
color: $color-black;
margin-bottom: 26px;
font-size: 0px;
&::before {
content: "Identificação";
font-family: $font-family-secundary;
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 19px;
}
}
p {
label {
color: $color-black;
font-weight: 500;
font-family: $font-family;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: $color-gray2;
}
select,
input {
border-radius: 0;
border: 1px solid $color-gray4;
border-radius: 5px;
border: 1px solid $color-border-radius-figma;
box-shadow: none;
}
@ -212,6 +286,7 @@
.box-client-info-pj {
.link a#is-corporate-client,
.link a#not-corporate-client {
display: none;
color: $color-black;
font-weight: 500;
text-decoration: underline;
@ -223,13 +298,24 @@
}
button.submit {
background: $color-blue-figma;
border-radius: 8px;
border: none;
border-radius: 5px;
background: $color-black;
margin-top: 8px;
outline: none;
transition: all 0.2s linear;
font-family: $font-family;
font-style: normal;
font-weight: 700;
font-size: 14px;
line-height: 19px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: $color-white;
width: 100%;
&:hover {
background: lighten($color-black, 5);
}

37
checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss
View File

@ -5,6 +5,9 @@
}
.cart-template {
//border: 1px solid #e5e5e5;
//border-radius: 8px;
padding: 0px;
@include mq(md, max) {
padding: 0 0;
}
@ -13,10 +16,10 @@
}
.cart {
font-family: $font-family-secundary;
border: 1px solid $color-gray3;
//border: 1px solid $color-gray3;
box-sizing: border-box;
border-radius: 5px;
padding: 16px;
padding: 0px 17px 19px 17px;
@include mq(md, max) {
margin: 0px 0 25px 0;
@ -29,9 +32,14 @@
position: relative !important;
}
.cart-fixed {
border: 1px solid #e5e5e5;
border-radius: 8px;
font-family: $font-family;
width: 100%;
h2 {
font-family: $font-family-secundary;
display: flex;
padding: 24px 0px 34px 17px;
background: $color-white;
border: none;
color: #303030;
@ -48,7 +56,7 @@
}
.cart {
border: 1px solid $color-gray4;
//border: 1px solid $color-gray4;
ul li {
border-top: none;
@ -74,13 +82,20 @@
}
#go-to-cart-button a {
color: #303030;
text-decoration: underline;
font-family: $font-family;
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 16px;
text-decoration-line: underline;
color: $color-black;
padding: 0px 17px 10px 0;
}
.summary-totalizers {
td.info {
width: 100%;
margin-right: -17px;
}
}
@ -753,21 +768,25 @@
.accordion-group {
tr {
border-top: 1px solid $color-border-radius-figma;
border-color: #e5e5e5;
padding: 25px 17px;
td {
margin-top: 25px;
margin-bottom: 25px;
&.empty {
display: none;
}
&.info,
&.monetary {
font-family: "Open Sans";
font-style: normal;
font-weight: normal;
font-weight: 400;
font-size: 14px;
line-height: 16px;
color: $color-black;
padding: 12px 0;
line-height: 19px;
color: $color-gray2;
}
&.info {

5
checkout/src/arquivos/sass/utils/_variaveis.scss
View File

@ -9,6 +9,11 @@ $color-black: #292929;
$color-white: #fff;
$color-border-radius-figma: #e0e0e0;
$color-border-radius-figma-2: #828282;
$color-figma-gray-medium: #808080;
$color-gray: #6c6c6c;
$color-gray2: #7d7d7d;
$color-gray3: #f0f0f0;