diff --git a/checkout/src/arquivos/js/components/Footer.js b/checkout/src/arquivos/js/components/Footer.js index 4493b6b..8152346 100644 --- a/checkout/src/arquivos/js/components/Footer.js +++ b/checkout/src/arquivos/js/components/Footer.js @@ -125,49 +125,51 @@ export default class Footer { } async onUpdate() { - // if (window.location.hash == "#/cart") { - // this.titleCart.classList.add("disable"); - // } //Função qeu fará a verificação se o carrinho está vazio para remover a prateleira de produtos: // vocês devem olhar a doc fornecida no Desafio para aprender a usar a MutationObserver // 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; - if (window.location.hash == "#/cart") { + let target = this.checkoutVazio; + if ( + window.location.href == "https://m3academy.myvtex.com/checkout/#/cart" && + this.checkoutVazio.style.display == "none" + ) { + this.sliderProducts.classList.remove("disable"); + this.ListProducts(); + } else { + this.sliderProducts.classList.add("disable"); this.titleCart.classList.add("disable"); } + window.addEventListener("hashchange", () => { + if (window.location.hash == "#/cart" && target.style.display == "none") { + this.titleCart.classList.remove("disable"); + this.sliderProducts.classList.remove("disable"); + this.sliderProducts.innerHTML = ""; + this.ListProducts(); + } else { + this.sliderProducts.classList.add("disable"); + this.titleCart.classList.add("disable"); + } + }); let observer = new MutationObserver((mutations) => { mutations.forEach(() => { - if (target.style.display == "none") { + if (target.style.display == "none" && window.location.hash == "#/cart") { this.sliderProducts.classList.remove("disable"); this.titleCart.classList.remove("disable"); + this.sliderProducts.innerHTML = ""; this.ListProducts(); } else { this.sliderProducts.classList.add("disable"); this.titleCart.classList.add("disable"); - this.sliderProducts.innerHTML = ""; - } - }); - - window.addEventListener("hashchange", () => { - if (window.location.hash == "#/cart") { - if (target.style.display == "none") { - this.titleCart.classList.remove("disable"); - this.sliderProducts.classList.remove("disable"); - this.ListProducts(); - } - } else { - this.titleCart.classList.add("disable"); - this.sliderProducts.classList.add("disable"); - this.sliderProducts.innerHTML = ""; } }); }); - - observer.observe(this.checkoutVazio, { + observer.observe(target, { + childList: true, attributes: true, }); } + } diff --git a/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss b/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss index cbdf658..aab43ad 100644 --- a/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss +++ b/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss @@ -3,7 +3,7 @@ &-content { color: $color-black; text-align: center; - + margin-top: 15%; @include mq(md, max) { padding: 0 16px; }