NicollyVieira/m3-academy-template-checkout-nicolly-vieira
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: corrige estilos da pagina de autentificacao, carrinho e pagamento #6

Merged
NicollyVieira merged 1 commits from feature/correcoes into development 2022-12-20 17:50:17 +00:00
Conversation 0 Commits 1 Files Changed 5 +68 -35
5 changed files with 68 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -46,7 +46,6 @@ export default class Footer {
tituloCheckoutVazio.style.display = "none";
} else if (changeAttrName.display == "none") {
tituloCheckoutVazio.style.display = "block";
this.criaPrateleira();
}
@ -56,8 +55,11 @@ export default class Footer {
window.addEventListener("hashchange", () => {
if (window.location.hash == "#/cart") {
this.prateleira.style.display = "block";
tituloCheckoutVazio.style.display = "block";
} else {
this.prateleira.style.display = "none";
tituloCheckoutVazio.style.display = "none";
}
});
@ -126,6 +128,9 @@ export default class Footer {
this.prateleira.innerHTML = "";
tituloCheckoutVazio.style.display = "none";
}
if(window.location.href !== "https://m3academy.myvtex.com/checkout/#/cart") {
tituloCheckoutVazio.style.display = "none";
}
}

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

@ -848,7 +848,7 @@
width: 20px;
height: 20px;
float: left;
margin: auto 8px auto 0;
margin: 8px 8px 0 0;
@include mq(desktop4K, min) {
width: 40px;
@ -865,6 +865,8 @@
font-size: 24px;
line-height: 33px;
}
}
a {
font-family: "Open Sans";
@ -978,18 +980,23 @@
}
.form-step {
display: flex;
.steps-view {
width: 55%;
float: left;
left: 12px;
flex: 1;
position: inherit;
height: fit-content;
margin-left: 40px;
@include mq(tablet, max) {
width: auto;
position: inherit;
margin-left: 0;
}
@include mq(desktop4K, min) {
left: 40.52px;
// left: 40.52px;
margin-left: 40.52px;
li,
label,

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

@ -1,10 +1,7 @@
.row-fluid .full-cart.active {
margin: 0 0 43.42px;
}
.cart-template {
.cart {
border: 1px solid $gray-100;
@ -55,6 +52,7 @@
display: flex;
grid-area: quantity;
margin: 11px 0 0 16px;
input {
margin: 0;
}
@ -89,6 +87,13 @@
}
.quantity {
width: auto;
margin: 0 0 0 16px !important;
}
}
@include mq(cstm, max) {
.quantity {
margin: 0 0 0 76px !important;
}
}
@ -114,6 +119,23 @@
padding: 0;
text-align: start;
&.quantity {
text-align: start;
border: 1px solid #f0f0f0;
border-radius: 8px;
box-sizing: border-box;
display: flex;
align-items: center;
max-width: 99px;
padding: 9px 11px;
height: 34px;
margin-top: 13px;
input {
flex: 1;
}
}
&.product-image {
height: auto;
padding: 0;
@ -548,18 +570,23 @@
a {
padding: 12.09px 0 12.72px;
font-family: "Open Sans";
font-weight: 700;
font-size: 14px;
line-height: 19px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: $black-500;
width: 100%;
background-color: $blue-500;
border-radius: 8px;
border: none;
font-size: 0;
&::before {
content: "Finalizar compra";
font-family: "Open Sans";
font-weight: 700;
font-size: 14px;
line-height: 19px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: $black-500;
}
@include mq(desktop4K, min) {
font-size: 24px;
@ -598,9 +625,6 @@
}
tr {
td {
font-family: "Tenor Sans";
font-weight: 400;

23
checkout/src/arquivos/sass/checkout/_checkout-pagamento.scss
View File

@ -4,9 +4,6 @@ body .container-main.container-order-form .orderform-template.active {
margin-left: unset;
margin-right: 0;
float: right;
border: 1px solid #e5e5e5;
padding: 24px 17px 0;
border-radius: 8px;
@include mq(tablet, max) {
margin: 17px 16px 0 16px;
@ -15,10 +12,11 @@ body .container-main.container-order-form .orderform-template.active {
.cart-fixed {
box-sizing: border-box;
max-width: 331px;
border: 1px solid #e5e5e5;
border-radius: 8px;
width: auto;
position: inherit;
height: auto !important;
max-height: 407px !important;
@include mq(tablet, max) {
max-width: none;
@ -39,14 +37,9 @@ body .container-main.container-order-form .orderform-template.active {
line-height: 19px;
color: $black-300;
margin-bottom: 34px;
margin: 24px 17px 34px 17px;
border: none;
h2 {
font-size: 32px;
line-height: 37px;
}
@include mq(desktop4K, min) {
font-size: 32px;
line-height: 37px;
@ -59,7 +52,8 @@ body .container-main.container-order-form .orderform-template.active {
margin: 0;
li {
padding: 0;
box-sizing: border-box;
padding: 0 17px;
margin: 0;
border: none;
display: flex;
@ -128,6 +122,7 @@ body .container-main.container-order-form .orderform-template.active {
line-height: 16px;
text-align: right;
text-decoration-line: underline;
padding-right: 17px;
color: $black-500;
@ -141,7 +136,8 @@ body .container-main.container-order-form .orderform-template.active {
.summary-template-holder {
border: none;
background-color: transparent;
padding: 0;
padding: 0 17px;
box-sizing: border-box;
.summary-totalizers {
margin: 0;
@ -212,6 +208,7 @@ body .container-main.container-order-form .orderform-template.active {
text-transform: uppercase;
color: $white-500;
border: none;
margin-top: 20px;
@include mq(desktop4K, min) {
font-size: 28px;

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

@ -47,7 +47,7 @@ $gray-1000: #7d7d7d;
/* Grid breakpoints */
$grid-breakpoints: (
xs: 0,
cstm: 400,
cstm: 491px,
sm: 576px,
md: 768px,
lg: 992px,