diff --git a/src/components/head.html b/src/components/head.html index 3b2f476..3c3df46 100644 --- a/src/components/head.html +++ b/src/components/head.html @@ -55,11 +55,11 @@
  • - +
  • - +
  • @@ -117,16 +117,25 @@ player.pause() } } - function tube() { + window.tube = (run_tri) => { const tubeBg = document.getElementById('tubes'); const pageContent = document.getElementById("page-content"); + const triangle = document.getElementById('triangle'); + const tube = document.getElementById('tube'); - if (tubeBg.style.display == "block") { - tubeBg.style.display = "none"; - pageContent.style.backgroundImage = "linear-gradient(to bottom, rgb(0, 0, 0), #636363 1024px)"; - } else { + if (run_tri) { + triangle.checked = false; + window.triangle(false); + } + + if (tube.checked) { tubeBg.style.display = "block"; - pageContent.style.backgroundImage = "linear-gradient(to bottom, rgb(0, 0, 0, 0), #636363BE 768px)"; + if (run_tri) { + pageContent.style.backgroundImage = "linear-gradient(to bottom, rgb(0, 0, 0, 0), #636363BE 768px)"; + } + } else { + tubeBg.style.display = "none"; + pageContent.style.removeProperty('background-image'); } } diff --git a/src/triangle.js b/src/triangle.js index 972ae04..8c4dc6d 100644 --- a/src/triangle.js +++ b/src/triangle.js @@ -1,6 +1,11 @@ -window.triangle = (event) => { - const checked = event.target.checked; - const pageContent = document.getElementById("page-content"); +window.triangle = (run_tube) => { + const checked = document.getElementById('triangle').checked; + const tube = document.getElementById('tube') + + if (run_tube) { + tube.checked = false; + window.tube(false); + } if (checked) { thisStylesheet.href = new URL("triangle.css", import.meta.url);