diff --git a/GameLogic.js b/GameLogic.js index 85f0940..4a748f7 100644 --- a/GameLogic.js +++ b/GameLogic.js @@ -66,15 +66,22 @@ } //buat ngatur batu spwan apa ga nanti - document - .getElementById("mode-normal") - .addEventListener("click", function () { + const halaman = document.querySelector(".HalamanFull"); + const gameCanvas = document.getElementById("game"); + + document.getElementById("mode-normal").addEventListener("click", function () { + halaman.style.backgroundImage ='url("halamanFull/cherryBlossom.png")'; + halaman.style.setProperty("--overlay-opacity", "0.4"); + gameCanvas.style.filter = "brightness(1)"; + StartingGame(false); }); - document - .getElementById("mode-tambahan") - .addEventListener("click", function () { + document.getElementById("mode-tambahan").addEventListener("click", function () { + halaman.style.backgroundImage ='url("halamanFull/cherryBlossomNight.png")'; + halaman.style.setProperty("--overlay-opacity", "0.7"); + gameCanvas.style.filter = "brightness(0.5)"; + StartingGame(true); }); diff --git a/GameStyle.css b/GameStyle.css index eff4666..cf311b9 100644 --- a/GameStyle.css +++ b/GameStyle.css @@ -40,7 +40,8 @@ content: ""; position: absolute; inset: 0; - background: rgba(0,0,0,0.4); /* 0.4 = opacity overlay */ + background: rgba(0,0,0, var(-- overlay-opacity, 0.4)); /* 0.4 = opacity overlay */ + pointer-events: none; } .starting { border: 2px solid pink; @@ -159,10 +160,6 @@ font-optical-sizing: auto; font-weight: 400; font-style: normal; - background-image: url("gameOver/gameOver.png"); - background-size: 100% 100%; - background-position: center; - background-repeat: no-repeat; } #mode-normal { background-color: #73e4c2; diff --git a/game.html b/game.html index ae6a400..442829d 100644 --- a/game.html +++ b/game.html @@ -22,7 +22,7 @@