Trocando icones do timer quando tem ou não

index.html

@@ -25,7 +25,8 @@
           <span class="number-of-question">1 de 3 perguntas</span>
         </div>
         <div class="timer-div">
-          <img src="timer-icon.svg" />
+          <img id="timer-on-icon" src="timer-icon.svg" />
+          <img id="timer-off-icon" class="hide" src="timer-off-icon.svg" />
           <span class="time-left">15s</span>
         </div>
       </div>

script.js

@@ -7,7 +7,8 @@ const time4Question = 0       // tempo em segundos (+1) para cada pergunta ser r
 const porTemas = false        // perguntas apresentadas agrupadas por tema (true) ou não (false) 
 
 //References
-let timeDiv = document.querySelector(".timer-div");
+let timerOnIcon = document.getElementById("timer-on-icon");
+let timerOffIcon = document.getElementById("timer-off-icon");
 let timeLeft = document.querySelector(".time-left");
 let quizContainer = document.getElementById("container");
 let nextBtn = document.getElementById("next-button");
@@ -229,9 +230,14 @@ function initial() {
     count = time4Question;
     clearInterval(countdown);
     timerDisplay();
+    timerOnIcon.classList.remove("hide");
+    timerOffIcon.classList.add("hide");
+    timeLeft.classList.remove("hide")
   }
   else {
-    timeDiv.classList.add("hide");
+    timerOnIcon.classList.add("hide");
+    timeLeft.classList.add("hide");
+    timerOffIcon.classList.remove("hide");
   }
   themeList = [];
   themeListCreator();

timer-off-icon.svg

+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg  width="20" height="20" viewBox="2 2 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+
+<g id="SVGRepo_iconCarrier"> <path d="M3.28034 2.21968C2.98745 1.92678 2.51257 1.92677 2.21968 2.21966C1.92678 2.51255 1.92677 2.98743 2.21966 3.28032L6.21321 7.27395C4.54413 8.82598 3.5 11.041 3.5 13.5C3.5 18.1944 7.30558 22 12 22C14.4589 22 16.6739 20.9559 18.2259 19.2869L20.7194 21.7805C21.0123 22.0734 21.4872 22.0734 21.7801 21.7805C22.073 21.4876 22.073 21.0127 21.7801 20.7198L3.28034 2.21968ZM12.6164 13.6773C12.481 13.8723 12.2554 14 12 14C11.6203 14 11.3065 13.7178 11.2568 13.3518L11.25 13.25V12.3108L12.6164 13.6773Z" fill="#0a69ed"/> <path d="M12.75 8.74999V9.56816L19.8784 16.6967C20.2792 15.7099 20.5 14.6307 20.5 13.5C20.5 8.80557 16.6944 4.99999 12 4.99999C10.8693 4.99999 9.79024 5.22076 8.80345 5.62153L11.4367 8.25482C11.5741 8.09858 11.7756 7.99999 12 7.99999C12.3797 7.99999 12.6935 8.28215 12.7432 8.64822L12.75 8.74999Z" fill="#0a69ed"/> <path d="M19.1704 5.12259L19.2517 5.18424L20.4008 6.18424C20.7132 6.45616 20.7461 6.9299 20.4742 7.24235C20.2249 7.52878 19.8061 7.58026 19.4973 7.3774L19.416 7.31575L18.267 6.31575C17.9545 6.04383 17.9217 5.57009 18.1936 5.25763C18.4428 4.97121 18.8617 4.91973 19.1704 5.12259Z" fill="#0a69ed"/> <path d="M14.25 2.49999C14.6642 2.49999 15 2.83578 15 3.24999C15 3.62969 14.7178 3.94348 14.3518 3.99315L14.25 3.99999H9.75C9.33579 3.99999 9 3.66421 9 3.24999C9 2.8703 9.28215 2.5565 9.64823 2.50684L9.75 2.49999H14.25Z" fill="#0a69ed"/> </g>
+
+</svg>
\ No newline at end of file