diff --git a/index.css b/index.css index 971b9bc..150fcc7 100644 --- a/index.css +++ b/index.css @@ -23,6 +23,14 @@ body.wide { gap: 2em; } +.solution { + text-align: center; + width: inherit; + display: block; + font-size: x-large; + display: none; +} + .row { margin-top: 0; margin-bottom: 0; diff --git a/index.js b/index.js index 8be5907..bac52dd 100644 --- a/index.js +++ b/index.js @@ -55,9 +55,13 @@ const MAX_GUESSES = 9; const guessed = []; let input = ""; const data = []; +const solutions = []; const done = [false, false, false, false]; function gameOver() { + for (const el of solutions) { + el.style.display = "block"; + } const NUMBERS = "0️⃣1️⃣2️⃣3️⃣4️⃣5️⃣6️⃣7️⃣8️⃣9️⃣"; const ANY = "⬜"; const POSITION = "🟨"; @@ -321,16 +325,21 @@ for (let i = 0; i < 3; i++) { function createGameGrid(container) { for (let pos = 0; pos < 4; pos++) { - container.appendChild(createWordle()); + container.appendChild(createWordle(chosenWords[pos])); } } -function createWordle() { +function createWordle(word) { const x = document.createElement("div"); x.className = "wordle"; for (let i = 0; i < MAX_GUESSES; i++) { x.appendChild(createRow(data)); } + const solution = document.createElement("span"); + solution.className = "solution"; + solution.innerText = word; + x.appendChild(solution); + solutions.push(solution); return x; }