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

fix: corrige aparecimento de titulo quando o carrinho estiver vazio ou nao #11

Merged
emmanuelvitor merged 1 commits from feature/tituloCartVazio into development 2022-12-26 00:06:17 +00:00
Conversation 0 Commits 1 Files Changed 6 +98 -11
6 changed files with 98 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -23,6 +23,7 @@ export default class Footer {
this.footerCheckoutVtexPci = await waitElement(".footerCheckout__vtexpci");
this.footerCheckoutDevelopedBy = await waitElement(".footerCheckout__developedBy");
this.footerCheckoutShelf = await waitElement(".footerCheckout__prateleira");
this.cartTitle = await waitElement("#cart-title");
@ -35,20 +36,25 @@ export default class Footer {
// sempre que o carrinho estiver vazio o elemento chcekoutVazio fica display: none e isso pode ser usado como atributo para a MutationObserver
let target = this.checkoutVazio;
let title = this.cartTitle;
let shelf = this.footerCheckoutShelf;
let config = { childList: true, attributes: true };
if (window.location.href === "https://m3academy.myvtex.com/checkout/#/cart" && this.checkoutVazio.style.display == "none") {
title.style.visibility = "initial";
shelf.classList.remove("none");
this.createfooterShelf();
} else {
title.style.visibility = "hidden"
shelf.classList.add("none");
}
window.addEventListener("hashchange", () => {
if (window.location.hash == "#/cart" && this.checkoutVazio.style.display == "none") {
title.style.visibility = "initial";
shelf.classList.remove("none")
this.createfooterShelf();
} else if (window.location.hash != "#/cart") {
title.style.visibility = "hidden"
shelf.classList.add("none");
}
@ -58,9 +64,11 @@ export default class Footer {
let observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (target.style.display == "none" && window.location.hash == "#/cart") {
title.style.visibility = "initial";
shelf.classList.remove("none");
this.createfooterShelf();
} else {
title.style.visibility = "hidden"
shelf.classList.add("none");
}

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

@ -1102,7 +1102,8 @@ li.hproduct.item.muted {
span.newsletter-text {
@media (min-width: 2500px) {
font-size: 24px;
line-height: 33px;
margin-left: 8.05px;
}
}
@ -1114,6 +1115,13 @@ span.newsletter-text {
}
}
span.error {
@media (min-width: 2500px) {
font-size: 26px;
line-height: 33px;
}
}
.vtex-omnishipping-1-x-addressFormPart1 small {
@media (min-width: 2500px) {
font-size: 24px;

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

@ -106,7 +106,6 @@
#payment-data-submit {
background: $color-blue2;
;
border: none;
border-radius: 8px;
color: $color-white;
@ -116,6 +115,9 @@
margin: 0 auto;
@media (min-width: 2500px) {
display: flex;
justify-content: center;
align-items: center;
font-size: 28px;
line-height: 38px;
}
@ -557,11 +559,14 @@
@include mq(md, max) {
margin-bottom: 40px;
@media (max-width:4900px) {
margin-bottom: 0;
}
}
.srp-pickup-my-location__button {
background-color: $color-blue2;
;
border: none;
border-radius: 5px;
color: $color-white;
@ -575,6 +580,12 @@
line-height: 16px;
letter-spacing: 0.05em;
@media (min-width: 2500px) {
font-size: 28px;
line-height: 33px;
min-width: 543px;
}
&:hover {
background-color: lighten($color-black, 5);
}
@ -588,6 +599,10 @@
.srp-toggle {
margin: 0 0 34px;
@media (min-width: 2500px) {
min-width: 543px;
}
&__wrapper {
background-color: $color-white;
border-radius: 100px;
@ -612,6 +627,11 @@
label {
width: 50%;
@media (min-width: 2500px) {
font-size: 28px;
line-height: 38px;
}
&:active {
background-color: $color-gray3;
}
@ -628,6 +648,11 @@
line-height: 14px;
color: $color-black;
margin-bottom: 12px;
@media (min-width: 2500px) {
font-size: 24px;
line-height: 33px;
}
}
input {
@ -670,7 +695,7 @@
left: 100%;
font-size: 28px;
line-height: 38px;
top: 30%;
top: 40%;
margin-left: 18.04px;
}
@ -721,6 +746,11 @@
left: 0;
width: 100%;
top: 17px;
@media (min-width: 2500px) {
font-size: 18px;
line-height: 45px;
}
}
}
}
@ -1051,6 +1081,8 @@
flex-direction: column;
width: 343px;
@include mq(md, max) {
padding: 0 16px;
width: calc(100% - 32px);
@ -1063,6 +1095,11 @@
padding-bottom: 50px;
}
@media (max-width:1025px) {
margin-bottom: 0;
}
.link-choose-more-products-wrapper {
display: block;
text-align: center;
@ -1156,9 +1193,12 @@
display: none;
}
}
.icon-lock:before {
display: none;
}
.payment-group-list-btn {
margin: 0;
@ -1293,4 +1333,13 @@ i.icon.icon-remove.item-remove-ico {
height: 61px;
font-size: 28px;
}
}
element.style {}
.row-fluid .full-cart {
@media (max-width:490px) {
margin-bottom: 0;
}
}

8
checkout/src/arquivos/sass/checkout/_checkout.scss
View File

@ -18,6 +18,10 @@ footer .footerCheckout__prateleira,
header {
width: 79.53125%;
margin: 0 auto;
@media (max-width:1024px) {
width: 98%;
}
}
body {
@ -53,6 +57,10 @@ body {
.container-order-form,
.container-cart {
width: 80%;
@media (max-width:1024px) {
width: 100%;
}
}
}

4
checkout/src/arquivos/sass/lib/_slick.scss
View File

@ -128,7 +128,7 @@
}
@media (max-width: 490px) {
bottom: 45.33%
bottom: 48.33%
}
}
@ -142,7 +142,7 @@
}
@media (max-width: 490px) {
left: 13px;
left: 10px;
}
}

22
checkout/src/arquivos/sass/partials/_prateleira.scss
View File

@ -22,8 +22,8 @@
@media (min-width:2500px) {
font-size: 48px;
line-height: 76px;
}
}
&__list {
@ -35,6 +35,15 @@
gap: 16.94px;
}
@media (max-width:490px) {
margin: 0 15px 56px;
}
@media (min-width:370px) and (max-width:380px) {
margin: 0 0 56px;
}
.footerCheckout__card {
width: 100%;
@ -53,6 +62,10 @@
.footerCheckout__container {
display: flex;
@ -62,6 +75,10 @@
gap: 20px;
height: auto;
@media (min-width:370px) and (max-width:380px) {
width: 164px;
}
li,
a {
@ -154,9 +171,6 @@
flex-wrap: wrap;
min-height: 61px;
&__skuName {
height: 28px;
}
}
}