diff --git a/index.html b/index.html index 09dbc6f..af415b4 100644 --- a/index.html +++ b/index.html @@ -12,14 +12,15 @@
- - - - - - - - + + + + + + + + +
diff --git a/script.js b/script.js index 3a3156a..67d92de 100644 --- a/script.js +++ b/script.js @@ -2,8 +2,9 @@ const container = document.querySelector(".container"); const conWidth = container.clientWidth; const grid = document.createElement("div"); const gridSlider = document.querySelector("#gridSlider"); -const buttons = document.querySelectorAll("button"); +const buttons = document.querySelectorAll(".pen"); const colorPicker = document.querySelector("#custom-color"); +const reset = document.querySelector("#reset"); let colorValue = "black"; let numGrid = gridSlider.value; let sliderLabel = document.querySelector("#sliderLabel"); @@ -20,6 +21,9 @@ let isWhite; let isErase; +createGrid(); + + buttons.forEach((button) => { button.addEventListener ("click", changeColor); }); @@ -31,6 +35,8 @@ colorPicker.addEventListener("change", changeColor); colorPicker.addEventListener("input", changeColor); colorPicker.addEventListener("click", changeColor); +reset.addEventListener("click", getGridDimensions); + function createGrid() { const gridArea = numGrid ** 2; @@ -190,7 +196,4 @@ function makeTransparent(value) { } return num; -} - - -createGrid(); \ No newline at end of file +} \ No newline at end of file