diff options
author | Thomas Voss <thomasvoss@live.com> | 2022-01-01 19:03:10 +0100 |
---|---|---|
committer | Thomas Voss <thomasvoss@live.com> | 2022-01-01 19:03:10 +0100 |
commit | 53acd91cf3bc4c5a8873e5eeb0afb4eb998934c7 (patch) | |
tree | ea2dd08cdc85abf87481208edb877af6528eeb38 /src/game.html | |
parent | 66f6f9a2c66309b5629702bd1e0563a698c19484 (diff) |
Reorganize files, and add lots of CSS
All images have been moved to img/
All source code has been moved to src/
The game.html page now has a draughts board, a vertical seperator, an
imcomplete move history table, a resign button, and a move history
title.
Diffstat (limited to 'src/game.html')
-rw-r--r-- | src/game.html | 198 |
1 files changed, 198 insertions, 0 deletions
diff --git a/src/game.html b/src/game.html new file mode 100644 index 0000000..4f8d308 --- /dev/null +++ b/src/game.html @@ -0,0 +1,198 @@ +<!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" type="text/css" href="style.css"> + <title>Draughts</title> +</head> +<body> + <div class="container left"> + <!-- The draughts board is represented using a table, the outer table allows us to have the + fancy spaced-out table border. --> + <table id="outer-board"> + <td> + <table id="board"> + <!-- Each row has squares which are either black or white, and only + black cells have IDs since a piece cannot land on a white cell. + --> + <tr> + <td id="1"></td> + <td></td> + <td id="2"></td> + <td></td> + <td id="3"></td> + <td></td> + <td id="4"></td> + <td></td> + <td id="5"></td> + <td></td> + </tr> + <tr> + <td id="6"></td> + <td></td> + <td id="7"></td> + <td></td> + <td id="8"></td> + <td></td> + <td id="9"></td> + <td></td> + <td id="10"></td> + <td></td> + </tr> + <tr> + <td id="11"></td> + <td></td> + <td id="12"></td> + <td></td> + <td id="13"></td> + <td></td> + <td id="14"></td> + <td></td> + <td id="15"></td> + <td></td> + </tr> + <tr> + <td id="16"></td> + <td></td> + <td id="17"></td> + <td></td> + <td id="18"></td> + <td></td> + <td id="19"></td> + <td></td> + <td id="20"></td> + <td></td> + </tr> + <tr> + <td id="21"></td> + <td></td> + <td id="22"></td> + <td></td> + <td id="23"></td> + <td></td> + <td id="24"></td> + <td></td> + <td id="25"></td> + <td></td> + </tr> + <tr> + <td id="26"></td> + <td></td> + <td id="27"></td> + <td></td> + <td id="28"></td> + <td></td> + <td id="29"></td> + <td></td> + <td id="30"></td> + <td></td> + </tr> + <tr> + <td id="31"></td> + <td></td> + <td id="32"></td> + <td></td> + <td id="33"></td> + <td></td> + <td id="34"></td> + <td></td> + <td id="35"></td> + <td></td> + </tr> + <tr> + <td id="36"></td> + <td></td> + <td id="37"></td> + <td></td> + <td id="38"></td> + <td></td> + <td id="39"></td> + <td></td> + <td id="40"></td> + <td></td> + </tr> + <tr> + <td id="41"></td> + <td></td> + <td id="42"></td> + <td></td> + <td id="43"></td> + <td></td> + <td id="44"></td> + <td></td> + <td id="45"></td> + <td></td> + </tr> + <tr> + <td id="46"></td> + <td></td> + <td id="47"></td> + <td></td> + <td id="48"></td> + <td></td> + <td id="49"></td> + <td></td> + <td id="50"></td> + <td></td> + </tr> + </table> + </td> + </table> + </div> + <div class="container right"> + <h1 id="history-title">Move History</h1> + <!-- The game/move history table is made up of 8 rows where the first column of each + row is the number of moves ago it was, the second column is blues move, and the + third is reds move. --> + <table id="history"> + <tr> + <td class="turn-no">8</td> + <td>37-32</td> + <td>22-28</td> + </tr> + <tr> + <td class="turn-no">7</td> + <td></td> + <td></td> + </tr> + <tr> + <td class="turn-no">6</td> + <td></td> + <td></td> + </tr> + <tr> + <td class="turn-no">5</td> + <td></td> + <td></td> + </tr> + <tr> + <td class="turn-no">4</td> + <td></td> + <td></td> + </tr> + <tr> + <td class="turn-no">3</td> + <td></td> + <td></td> + </tr> + <tr> + <td class="turn-no">2</td> + <td></td> + <td></td> + </tr> + <tr> + <td class="turn-no">1</td> + <td></td> + <td></td> + </tr> + </table> + + <div id="resign"> + <p>Resign</p> + </div> + </div> + <div id="vertical-rule"></div> +</body> +</html> |