-
Notifications
You must be signed in to change notification settings - Fork 124
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #454 from ritik48/New-Wordle-Game
[Fixes #395] Added Wordle Game
- Loading branch information
Showing
12 changed files
with
908 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| # **WORDLE** | ||
|
|
||
| --- | ||
|
|
||
| <br> | ||
|
|
||
| ## **Description 📃** | ||
| - Guess the word | ||
|
|
||
| ## **functionalities 🎮** | ||
| - 6 guesses given to the user | ||
| - Color coding for right, wrong and close guesses | ||
| - Keyboard key's color also change accordingly. | ||
| - User can choose word size 3, 4, or 5 letter words | ||
| - Score is also stored | ||
|
|
||
| <br> | ||
|
|
||
| ## **How to play? 🕹️** | ||
| - A word is randomly selected by the computer. | ||
| - Player tries to guess this word. | ||
| - When a guess is made. Tiles change its color accordingly. | ||
| Correct letter with correct position - GREEN | ||
| Correct letter with wrong position - YELLOW | ||
| Wrong letter - Grey | ||
| - The keyboard keys also change color based on above color coding scheme. | ||
| - User has to guess the word within a minute. | ||
|
|
||
| <br> | ||
|
|
||
| ## **Screenshots 📸** | ||
|
|
||
| <br> | ||
|
|
||
|  | ||
|
|
||
| <br> | ||
|
|
||
| ## **Working video 📹** | ||
| <!-- add your working video over here --> |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,97 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <link rel="stylesheet" href="./style.css"> | ||
| </head> | ||
|
|
||
| <body> | ||
| <div class="head"> | ||
| <div class="timer"> | ||
| <div class="circle">1:00</div> | ||
| </div> | ||
| <h2 class="title">Wordle</h2> | ||
|
|
||
|
|
||
| <div class="setting-btn"> | ||
| <img src="./images/setting.png" alt=""> | ||
| </div> | ||
|
|
||
| </div> | ||
|
|
||
| <main> | ||
| <div class="box-container"> | ||
|
|
||
| </div> | ||
| <div class="key-container"> | ||
| <div class="key">A</div> | ||
| <div class="key">B</div> | ||
| <div class="key">C</div> | ||
| <div class="key">D</div> | ||
| <div class="key">E</div> | ||
| <div class="key">F</div> | ||
| <div class="key">G</div> | ||
| <div class="key">H</div> | ||
| <div class="key">I</div> | ||
| <div class="key">J</div> | ||
| <div class="key">K</div> | ||
| <div class="key">L</div> | ||
| <div class="key">M</div> | ||
| <div class="key">N</div> | ||
| <div class="key">O</div> | ||
| <div class="key">P</div> | ||
| <div class="key">Q</div> | ||
| <div class="key">R</div> | ||
| <div class="key">S</div> | ||
| <div class="key">T</div> | ||
| <div class="key">U</div> | ||
| <div class="key">V</div> | ||
| <div class="key">W</div> | ||
| <div class="key">X</div> | ||
| <div class="key">Y</div> | ||
| <div class="key">Z</div> | ||
| <div class="key">Enter</div> | ||
| <div class="key">←</div> | ||
| </div> | ||
| </main> | ||
|
|
||
| <div class="popup"> | ||
| <div class="container"> | ||
| <h2>You Won !!!</h2> | ||
| <p>Score : 18</p> | ||
| <button class="play">Play Again</button> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="setting"> | ||
| <div class="container"> | ||
|
|
||
| <button class="close-popup"></button> | ||
| <div class="cont"> | ||
| <p>Word size </p> | ||
| <div> | ||
| <img src="./images/decrease.png" class="size-icon size-dec" alt=""> | ||
| <span class="word-length">4</span> | ||
| <img src="./images/increase.png" class="size-icon size-inc" alt=""> | ||
| </div> | ||
| </div> | ||
| <div class="cont"> | ||
| <p>High Score</p> | ||
| <span class="high-score"></span> | ||
| </div> | ||
| <button class="reset-score">Reset score</button> | ||
| </div> | ||
|
|
||
| </div> | ||
|
|
||
| <footer> | ||
| <p>Score : <span class="score">0</span></p> | ||
| </footer> | ||
|
|
||
| <script type="module" src="./script.js"></script> | ||
| </body> | ||
|
|
||
| </html> |
Oops, something went wrong.