Merge pull request #20 from viniciusstaiguer/main

Adição de propriedade e alteração da função

Author: gabrnunes

script.js

@@ -53,7 +53,7 @@ function timer() {
 
       if (seconds <= 10) {
         TIMER_STATUS = TimerStatus.COUNTDOWN;
-        styleCountdown(seconds);
+        styleBlinkCountdown(seconds);
       }
 
       setInputValues(seconds);
@@ -188,14 +188,27 @@ const styles = {
 function applyStyles() {
   resetStyles();
   styles[TIMER_STATUS]?.();
-}
+};
 
-function styleCountdown(seconds = 0) {
+function styleBlinkCountdown(seconds = 10) {
   document.querySelector(".input-stopwatch").classList.add("hide");
   document.querySelector(".js-stopwatch-button").classList.add("hide");
   document.getElementById("countdown").classList.remove("hide");
   document.getElementById("countdown-number").textContent = seconds;
-}
+
+  // Alterna a cor a cada segundo
+  if (seconds % 2 === 0) {
+    document.getElementById("countdown").style.backgroundColor = "#46ffbe";
+    document.getElementById("countdown-number").style.color = "#444444";
+  } else {
+    document.getElementById("countdown").style.backgroundColor = "#242424";
+    document.getElementById("countdown-number").style.color = "#46ffbe";
+  }
+};
+
+// function styleCountdown(seconds = 0) {
+  
+// }
 
 function styleRunning() {
   document.querySelector(".js-play-button").classList.add("press-start");

style.css

@@ -86,7 +86,13 @@ input::-webkit-inner-spin-button {
 
 input[type=number] {
   /* ta aparecendo um warning aqui pra mim, mas não sei arrumar, talvez eu seja burro */
-  -moz-appearance: textfield;
+  /*
+  Cara tu não é burro -moz-appearance é específica para Firefox 
+  Para melhorar compatibilidade adicionei duas duas propriedades
+  */
+  -moz-appearance: textfield; /* Para Firefox */
+  -webkit-appearance: none; /* Para Chrome, Safari, Edge */
+  appearance: none; /* Padrão - navegadores mais modernos */
 }
 
 #countdown {