WordGame-JS/Snowman-Full/index.html
2024-05-08 13:41:16 -04:00

41 lines
No EOL
1.5 KiB
HTML
Executable file

<!doctype html>
<html>
<head>
<link rel="Stylesheet" href="tools/bootstrap.css">
<link rel="Stylesheet" href="styles/styles.css">
<title>Snowman game</title>
</head>
<body>
<!-- Game content -->
<div class="container">
<h1 class="display-1 text-center">Snowman</h1>
<div class="row">
<div class="col-sm">
<canvas id="canvas" width="600" height="600"></canvas>
<p class="text-center">Save the snowman from melting!</p>
</div>
<div class="col-sm">
<form class="text-light p-3 border border-info d-flex align-items-end" autocomplete="off">
<div class="mb-3" style="line-height: 2">
<p id="answer" class="display-4 mb-5">_&nbsp;_&nbsp;_&nbsp;_</p>
<div class="d-flex align-baseline justify-content-between" style="width:220px;">
<input name="guessInput" type="text" class="form-control text-center mr-5" id="guessInput" maxlength="1" style="text-transform:uppercase" onkeypress="return /[a-z]/i.test(event.key)" >
<button type="submit" class="btn btn-primary ml-5 mb-0 align-self-end">Submit</button>
</div>
<p class="display-6 mt-5 my-3" id="alreadyGuessed"></p>
<p class="display-6 mt-5 my-3" id="feedback"></p>
</div>
</form>
</div>
</div>
</div>
<!-- Scripts -->
<script src="tools/bootstrap.js"></script>
<script src="tools/jquery.js"></script>
<script src="res/words.js"></script>
<script src="scripts/script.js"></script>
<script src="scripts/graphics.js"></script>
</body>
</html>