From 265efa765a9a06d2b0177c305293150b81cab3b0 Mon Sep 17 00:00:00 2001
From: NetMan <13informatyka14@gmail.com>
Date: Tue, 9 Jan 2024 20:18:10 +0100
Subject: [PATCH] Block color now in class instead of modifying inline style

---
 script.js | 8 ++++++--
 style.css | 4 ++++
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/script.js b/script.js
index 2cf9ed6..11af40e 100644
--- a/script.js
+++ b/script.js
@@ -14,9 +14,13 @@ function createGrid(size) {
     
     let blocks = document.querySelectorAll(".block");
     blocks.forEach(block => {
-        block.addEventListener("mouseover", (event) => {event.target.style.backgroundColor = "#000"});
+        block.addEventListener("mouseover", (event) => {
+            event.target.classList.add("colored")
+        });
         block.addEventListener("mouseout", (event) => {
-            setTimeout(() => event.target.style.backgroundColor = "#fff", 1 * 1000);
+            setTimeout(() => {
+                event.target.classList.remove("colored");
+            }, 1 * 1000);
         });
     })
 }
diff --git a/style.css b/style.css
index 8370513..147cae7 100644
--- a/style.css
+++ b/style.css
@@ -12,4 +12,8 @@
     /* padding: 10px; */
     flex: 1;
     aspect-ratio: 1 / 1;
+}
+
+.colored {
+    background-color: #000;
 }
\ No newline at end of file