feat(home): ajustando css e function para remover title da page inicial #5

Merged
BernardoWaldhelm merged 1 commits from feature/challenge into main 2022-12-22 13:35:48 +00:00
3 changed files with 17 additions and 14 deletions
Showing only changes of commit f763e56594 - Show all commits

View File

@ -19,6 +19,7 @@ export default class Footer {
this.footerCheckoutVtexPci = await waitElement(".footerCheckout__vtexpci"); this.footerCheckoutVtexPci = await waitElement(".footerCheckout__vtexpci");
this.footerCheckoutDeveloped = await waitElement(".footerCheckout__developedBy"); this.footerCheckoutDeveloped = await waitElement(".footerCheckout__developedBy");
this.footerPrateleira = await waitElement(".footerCheckout__prateleira"); this.footerPrateleira = await waitElement(".footerCheckout__prateleira");
this.myCart = await waitElement("#cart-title");
} }
async prateleiraFooterHTML() { async prateleiraFooterHTML() {
@ -154,18 +155,21 @@ export default class Footer {
// vocês devem olhar a doc fornecida no Desafio para aprender a usar a MutationObserver // 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 // sempre que o carrinho estiver vazio o elemento chcekoutVazio fica display: none e isso pode ser usado como atributo para a MutationObserver
let myCart = document.querySelector("#cart-title"); if (window.location.hash == "#/cart") {
let target = this.checkoutVazio; this.myCart.classList.add("inactive");
}
//monitorar display none -> target.style.display === "none"
let target = this.checkoutVazio;
let observer = new MutationObserver((mutations) => { let observer = new MutationObserver((mutations) => {
mutations.forEach(() => { mutations.forEach(() => {
if (target.style.display == "none") { if (target.style.display == "none") {
this.footerPrateleira.classList.remove("desable"); this.footerPrateleira.classList.remove("inactive");
myCart.classList.remove("desable"); this.myCart.classList.remove("inactive");
this.prateleiraFooterHTML(); this.prateleiraFooterHTML();
} else { } else {
this.footerPrateleira.classList.add("desable"); this.footerPrateleira.classList.add("inactive");
myCart.classList.add("desable"); this.myCart.classList.add("inactive");
this.footerPrateleira.innerHTML = ""; this.footerPrateleira.innerHTML = "";
} }
}); });
@ -173,20 +177,19 @@ export default class Footer {
window.addEventListener("hashchange", () => { window.addEventListener("hashchange", () => {
if (window.location.hash == "#/cart") { if (window.location.hash == "#/cart") {
if (target.style.display == "none") { if (target.style.display == "none") {
myCart.classList.remove("desable"); this.myCart.classList.remove("inactive");
this.footerPrateleira.classList.remove("desable"); this.footerPrateleira.classList.remove("inactive");
this.footerPrateleira.innerHTML = ""; this.footerPrateleira.innerHTML = "";
this.prateleiraFooterHTML(); this.prateleiraFooterHTML();
} else { } else {
myCart.classList.add("desable"); this.myCart.classList.add("inactive");
} }
} else { } else {
this.footerPrateleira.classList.add("desable"); this.footerPrateleira.classList.add("inactive");
myCart.classList.add("desable"); this.myCart.classList.add("inactive");
this.footerPrateleira.innerHTML = ""; this.footerPrateleira.innerHTML = "";
} }
}); });
//monitorar display none -> target.style.display === "none"
}); });
observer.observe(this.checkoutVazio, { observer.observe(this.checkoutVazio, {
attributes: true, attributes: true,

View File

@ -222,7 +222,7 @@
} }
.desable { .inactive {
display: none; display: none;
} }
} }

View File

@ -245,4 +245,4 @@
} }
.desable {display: none !important;} .inactive {display: none !important;}