diff --git a/docs/bitty-menu.js b/docs/bitty-menu.js index cdd8b31..49e43d4 100644 --- a/docs/bitty-menu.js +++ b/docs/bitty-menu.js @@ -85,11 +85,12 @@ class Menu { target.scrollLeft = 0; } - close() { - let menu = document.querySelector("dialog.menu"); - menu?.close(); + close(dialog) { + dialog.close(); + dialog.parentNode.removeChild(dialog); this.button?.classList.remove("open") } + show(info) { let url = location.href; let fullMenu = !info; @@ -97,10 +98,7 @@ class Menu { let urlField = el("input.url", {value:url, readonly:true}); urlField.onclick = (e) => this.selectField(urlField); let menu = el("dialog.menu", {onclick: (e) => { - if (e.target.tagName == 'DIALOG') { - e.target.close(); - this.button?.classList.remove("open") - } + if (e.target.tagName == 'DIALOG') { this.close(menu); } }}, el("div.menu-container", {}, urlField, el("div.menu-icons", diff --git a/docs/index.css b/docs/index.css index 70270e4..31d2abf 100644 --- a/docs/index.css +++ b/docs/index.css @@ -61,14 +61,16 @@ body { font-size: 48px; /* transition: font-size 1000ms ease-in; */ } +#menu.open svg, #menu:hover svg{ background:#16161d; } - +#menu.open svg .inner, #menu:hover svg .inner { fill:white; } +#menu.open svg .outer, #menu:hover svg .outer { fill:transparent; }