forked from M3-Academy/m3-academy-template-checkout
feat(home): ajustando css e function para remover title da page inicial #5
@ -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,
|
||||||
|
@ -222,7 +222,7 @@
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.desable {
|
.inactive {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -245,4 +245,4 @@
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.desable {display: none !important;}
|
.inactive {display: none !important;}
|
||||||
|
Loading…
Reference in New Issue
Block a user