diff --git a/xray.css b/xray.css index 9114e1d..e2ac8d9 100644 --- a/xray.css +++ b/xray.css @@ -98,4 +98,24 @@ img { --opacity: 0; opacity: var(--opacity); z-index: 1; +} + +#menu.start > label { + background: none; +} +label { + margin: 5px; + background: #222; +} + +label span { + user-select: none; +} + +label input { + margin: auto; +} + +.hidden { + display: none !important; } \ No newline at end of file diff --git a/xray.html b/xray.html index ca8530e..8b707c3 100644 --- a/xray.html +++ b/xray.html @@ -14,53 +14,55 @@ +
diff --git a/xray.js b/xray.js index 4412ecc..741d677 100644 --- a/xray.js +++ b/xray.js @@ -26,6 +26,18 @@ let scale; document.addEventListener("DOMContentLoaded", e => { document.querySelector("#reset-button").addEventListener("click", reset); + document.querySelector("#show-toolbar").addEventListener("click", e => { + document.querySelector("#menu").classList.remove("hidden") + document.querySelector("#show-toolbar").classList.add("hidden") + setup(); + }) + document.querySelector("#hide-toolbar").addEventListener("click", e => { + document.querySelector("#menu").classList.add("hidden") + document.querySelector("#show-toolbar").classList.remove("hidden") + setup(); + }) + document.querySelector("#show-toolbar").classList.add("hidden") + document.querySelector("#load-button").addEventListener("click", e => { console.log("Trying to load..."); const baseInput = document.querySelector("#base-url").value; @@ -373,6 +385,8 @@ document.addEventListener("DOMContentLoaded", e => { + document.querySelector("#menu").classList.add("hidden") + document.querySelector("#show-toolbar").classList.remove("hidden") load(); } else {