75 lines
4.0 KiB
HTML
75 lines
4.0 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Калькулятор 5 букв</title>
|
||
<link rel="stylesheet" href="styles.css">
|
||
</head>
|
||
<body>
|
||
<div class="calculator-container">
|
||
<h1>Калькулятор для игры 5 букв</h1>
|
||
<div class="inputs">
|
||
<label for="correct-mask">Маска (буквы на своем месте):</label>
|
||
<div id="mask-container">
|
||
<input type="text" maxlength="1" class="mask-letter">
|
||
<input type="text" maxlength="1" class="mask-letter">
|
||
<input type="text" maxlength="1" class="mask-letter">
|
||
<input type="text" maxlength="1" class="mask-letter">
|
||
<input type="text" maxlength="1" class="mask-letter">
|
||
</div>
|
||
|
||
<label>Маски (буквы не на своих местах, для каждой попытки):</label>
|
||
<div id="incorrect-masks">
|
||
<div class="incorrect-mask-container">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
</div>
|
||
<div class="incorrect-mask-container">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
</div>
|
||
<div class="incorrect-mask-container">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
</div>
|
||
<div class="incorrect-mask-container">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
</div>
|
||
<div class="incorrect-mask-container">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
<input type="text" maxlength="1" class="incorrect-mask-letter">
|
||
</div>
|
||
</div>
|
||
|
||
<label for="excluded-letters">Отсутствующие буквы:</label>
|
||
<input type="text" id="excluded-letters" placeholder="Например, г, д, е">
|
||
|
||
<button id="calculate-btn">Рассчитать</button>
|
||
</div>
|
||
<div class="results">
|
||
<h2>Возможные слова:</h2>
|
||
<ul id="results-list"></ul>
|
||
</div>
|
||
</div>
|
||
<script src="script.js"></script>
|
||
</body>
|
||
</html>
|
||
|