style: score notif

src/css/game.css

@@ -213,4 +213,29 @@
     left: 5%;
     transform: translate(-50%, -50%);
     z-index: 999;
-}
+}
+
+.floating-points {
+    position: absolute;
+    top: 50%; 
+    left: 50%;
+    transform: translate(-50%, -50%);
+    color: #ffdf12;  
+    font-size: 3rem;
+    font-weight: bold;
+    text-shadow: 2px 2px 0px #000; 
+    pointer-events: none; 
+    z-index: 999;
+    animation: floatUp 1s ease-out forwards;
+}
+
+@keyframes floatUp {
+    0%{
+        opacity: 1;
+        transform: translate(-50%,-50%) scale(1);
+    }
+    100%{
+        opacity: 0;
+        transform: translate(-50%, -150%) scale(1.5)
+    }
+}

src/js/firstperson.js

@@ -91,6 +91,9 @@ function selectAnswer(e){
     if(isCorrect){
         selectedBtn.classList.add("correct");
         score += 10;
+
+        showFloatingText();
+
         shake(document.getElementById("boss"))
         dmg();
         const bgm = document.getElementById("sfx");
@@ -175,4 +178,17 @@ function postScore(score){
         alert("Terjadi kesalahan koneksi.");
     });
 }
+function showFloatingText(){
+    const bossContainer = document.querySelector(".boss");
+    const point = document.createElement("div");
+
+    point.textContent = "+10";
+    point.classList.add("floating-points");
+
+    bossContainer.appendChild(point);
+
+    setTimeout(()=>{
+        point.remove();
+    }, 800);
+}
 startQuiz()