s3lph/webgames
s3lph/webgames
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity
webgames/templates/sudoku.example.html

659 lines
30 KiB
HTML
Raw Permalink Normal View History

Initial commit
2021-10-31 14:44:14 +01:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sudoku</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<main>
<form method="POST" action="#">
<div id="sudoku-field">
<table>
<tr class="odd row-1">
<td class="odd col-1">
<input type="radio" id="sudoku-field-11", name="sudoku-field" value="11" class="sudoku-field"/>
<label for="sudoku-field-11" id="sudoku-field-11-label" class="sudoku-field">
1
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-12", name="sudoku-field" value="12" class="sudoku-field"/>
<label for="sudoku-field-12" id="sudoku-field-12-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-13", name="sudoku-field" value="13" class="sudoku-field"/>
<label for="sudoku-field-13" id="sudoku-field-13-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-14", name="sudoku-field" value="14" class="sudoku-field"/>
<label for="sudoku-field-14" id="sudoku-field-14-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-15", name="sudoku-field" value="15" class="sudoku-field"/>
<label for="sudoku-field-15" id="sudoku-field-15-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-16", name="sudoku-field" value="16" class="sudoku-field"/>
<label for="sudoku-field-16" id="sudoku-field-16-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-17", name="sudoku-field" value="17" class="sudoku-field"/>
<label for="sudoku-field-17" id="sudoku-field-17-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-18", name="sudoku-field" value="18" class="sudoku-field"/>
<label for="sudoku-field-18" id="sudoku-field-18-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-19", name="sudoku-field" value="19" class="sudoku-field"/>
<label for="sudoku-field-19" id="sudoku-field-19-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="even row-2">
<td class="odd col-1">
<input type="radio" id="sudoku-field-21", name="sudoku-field" value="21" class="sudoku-field"/>
<label for="sudoku-field-21" id="sudoku-field-21-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-22", name="sudoku-field" value="22" class="sudoku-field"/>
<label for="sudoku-field-22" id="sudoku-field-22-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-23", name="sudoku-field" value="23" class="sudoku-field"/>
<label for="sudoku-field-23" id="sudoku-field-23-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-24", name="sudoku-field" value="24" class="sudoku-field"/>
<label for="sudoku-field-24" id="sudoku-field-24-label" class="sudoku-field">
1
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-25", name="sudoku-field" value="25" class="sudoku-field"/>
<label for="sudoku-field-25" id="sudoku-field-25-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-26", name="sudoku-field" value="26" class="sudoku-field"/>
<label for="sudoku-field-26" id="sudoku-field-26-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-27", name="sudoku-field" value="27" class="sudoku-field"/>
<label for="sudoku-field-27" id="sudoku-field-27-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-28", name="sudoku-field" value="28" class="sudoku-field"/>
<label for="sudoku-field-28" id="sudoku-field-28-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-29", name="sudoku-field" value="29" class="sudoku-field"/>
<label for="sudoku-field-29" id="sudoku-field-29-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="odd row-3">
<td class="odd col-1">
<input type="radio" id="sudoku-field-31", name="sudoku-field" value="31" class="sudoku-field"/>
<label for="sudoku-field-31" id="sudoku-field-31-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-32", name="sudoku-field" value="32" class="sudoku-field"/>
<label for="sudoku-field-32" id="sudoku-field-32-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-33", name="sudoku-field" value="33" class="sudoku-field"/>
<label for="sudoku-field-33" id="sudoku-field-33-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-34", name="sudoku-field" value="34" class="sudoku-field"/>
<label for="sudoku-field-34" id="sudoku-field-34-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-35", name="sudoku-field" value="35" class="sudoku-field"/>
<label for="sudoku-field-35" id="sudoku-field-35-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-36", name="sudoku-field" value="36" class="sudoku-field"/>
<label for="sudoku-field-36" id="sudoku-field-36-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-37", name="sudoku-field" value="37" class="sudoku-field"/>
<label for="sudoku-field-37" id="sudoku-field-37-label" class="sudoku-field">
1
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-38", name="sudoku-field" value="38" class="sudoku-field"/>
<label for="sudoku-field-38" id="sudoku-field-38-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-39", name="sudoku-field" value="39" class="sudoku-field"/>
<label for="sudoku-field-39" id="sudoku-field-39-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="even row-4">
<td class="odd col-1">
<input type="radio" id="sudoku-field-41", name="sudoku-field" value="41" class="sudoku-field"/>
<label for="sudoku-field-41" id="sudoku-field-41-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-42", name="sudoku-field" value="42" class="sudoku-field"/>
<label for="sudoku-field-42" id="sudoku-field-42-label" class="sudoku-field">
1
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-43", name="sudoku-field" value="43" class="sudoku-field"/>
<label for="sudoku-field-43" id="sudoku-field-43-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-44", name="sudoku-field" value="44" class="sudoku-field"/>
<label for="sudoku-field-44" id="sudoku-field-44-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-45", name="sudoku-field" value="45" class="sudoku-field"/>
<label for="sudoku-field-45" id="sudoku-field-45-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-46", name="sudoku-field" value="46" class="sudoku-field"/>
<label for="sudoku-field-46" id="sudoku-field-46-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-47", name="sudoku-field" value="47" class="sudoku-field"/>
<label for="sudoku-field-47" id="sudoku-field-47-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-48", name="sudoku-field" value="48" class="sudoku-field"/>
<label for="sudoku-field-48" id="sudoku-field-48-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-49", name="sudoku-field" value="49" class="sudoku-field"/>
<label for="sudoku-field-49" id="sudoku-field-49-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="odd row-5">
<td class="odd col-1">
<input type="radio" id="sudoku-field-51", name="sudoku-field" value="51" class="sudoku-field"/>
<label for="sudoku-field-51" id="sudoku-field-51-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-52", name="sudoku-field" value="52" class="sudoku-field"/>
<label for="sudoku-field-52" id="sudoku-field-52-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-53", name="sudoku-field" value="53" class="sudoku-field"/>
<label for="sudoku-field-53" id="sudoku-field-53-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-54", name="sudoku-field" value="54" class="sudoku-field"/>
<label for="sudoku-field-54" id="sudoku-field-54-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-55", name="sudoku-field" value="55" class="sudoku-field"/>
<label for="sudoku-field-55" id="sudoku-field-55-label" class="sudoku-field">
1
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-56", name="sudoku-field" value="56" class="sudoku-field"/>
<label for="sudoku-field-56" id="sudoku-field-56-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-57", name="sudoku-field" value="57" class="sudoku-field"/>
<label for="sudoku-field-57" id="sudoku-field-57-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-58", name="sudoku-field" value="58" class="sudoku-field"/>
<label for="sudoku-field-58" id="sudoku-field-58-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-59", name="sudoku-field" value="59" class="sudoku-field"/>
<label for="sudoku-field-59" id="sudoku-field-59-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="even row-6">
<td class="odd col-1">
<input type="radio" id="sudoku-field-61", name="sudoku-field" value="61" class="sudoku-field"/>
<label for="sudoku-field-61" id="sudoku-field-61-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-62", name="sudoku-field" value="62" class="sudoku-field"/>
<label for="sudoku-field-62" id="sudoku-field-62-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-63", name="sudoku-field" value="63" class="sudoku-field"/>
<label for="sudoku-field-63" id="sudoku-field-63-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-64", name="sudoku-field" value="64" class="sudoku-field"/>
<label for="sudoku-field-64" id="sudoku-field-64-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-65", name="sudoku-field" value="65" class="sudoku-field"/>
<label for="sudoku-field-65" id="sudoku-field-65-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-66", name="sudoku-field" value="66" class="sudoku-field"/>
<label for="sudoku-field-66" id="sudoku-field-66-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-67", name="sudoku-field" value="67" class="sudoku-field"/>
<label for="sudoku-field-67" id="sudoku-field-67-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-68", name="sudoku-field" value="68" class="sudoku-field"/>
<label for="sudoku-field-68" id="sudoku-field-68-label" class="sudoku-field">
1
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-69", name="sudoku-field" value="69" class="sudoku-field"/>
<label for="sudoku-field-69" id="sudoku-field-69-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="odd row-7">
<td class="odd col-1">
<input type="radio" id="sudoku-field-71", name="sudoku-field" value="71" class="sudoku-field"/>
<label for="sudoku-field-71" id="sudoku-field-71-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-72", name="sudoku-field" value="72" class="sudoku-field"/>
<label for="sudoku-field-72" id="sudoku-field-72-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-73", name="sudoku-field" value="73" class="sudoku-field"/>
<label for="sudoku-field-73" id="sudoku-field-73-label" class="sudoku-field">
1
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-74", name="sudoku-field" value="74" class="sudoku-field"/>
<label for="sudoku-field-74" id="sudoku-field-74-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-75", name="sudoku-field" value="75" class="sudoku-field"/>
<label for="sudoku-field-75" id="sudoku-field-75-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-76", name="sudoku-field" value="76" class="sudoku-field"/>
<label for="sudoku-field-76" id="sudoku-field-76-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-77", name="sudoku-field" value="77" class="sudoku-field"/>
<label for="sudoku-field-77" id="sudoku-field-77-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-78", name="sudoku-field" value="78" class="sudoku-field"/>
<label for="sudoku-field-78" id="sudoku-field-78-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-79", name="sudoku-field" value="79" class="sudoku-field"/>
<label for="sudoku-field-79" id="sudoku-field-79-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="even row-8">
<td class="odd col-1">
<input type="radio" id="sudoku-field-81", name="sudoku-field" value="81" class="sudoku-field"/>
<label for="sudoku-field-81" id="sudoku-field-81-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-82", name="sudoku-field" value="82" class="sudoku-field"/>
<label for="sudoku-field-82" id="sudoku-field-82-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-83", name="sudoku-field" value="83" class="sudoku-field"/>
<label for="sudoku-field-83" id="sudoku-field-83-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-84", name="sudoku-field" value="84" class="sudoku-field"/>
<label for="sudoku-field-84" id="sudoku-field-84-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-85", name="sudoku-field" value="85" class="sudoku-field"/>
<label for="sudoku-field-85" id="sudoku-field-85-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-86", name="sudoku-field" value="86" class="sudoku-field"/>
<label for="sudoku-field-86" id="sudoku-field-86-label" class="sudoku-field">
1
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-87", name="sudoku-field" value="87" class="sudoku-field"/>
<label for="sudoku-field-87" id="sudoku-field-87-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-88", name="sudoku-field" value="88" class="sudoku-field"/>
<label for="sudoku-field-88" id="sudoku-field-88-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-89", name="sudoku-field" value="89" class="sudoku-field"/>
<label for="sudoku-field-89" id="sudoku-field-89-label" class="sudoku-field">
</label>
</td>
</tr>
<tr class="odd row-9">
<td class="odd col-1">
<input type="radio" id="sudoku-field-91", name="sudoku-field" value="91" class="sudoku-field"/>
<label for="sudoku-field-91" id="sudoku-field-91-label" class="sudoku-field">
</label>
</td>
<td class="even col-2">
<input type="radio" id="sudoku-field-92", name="sudoku-field" value="92" class="sudoku-field"/>
<label for="sudoku-field-92" id="sudoku-field-92-label" class="sudoku-field">
</label>
</td>
<td class="odd col-3">
<input type="radio" id="sudoku-field-93", name="sudoku-field" value="93" class="sudoku-field"/>
<label for="sudoku-field-93" id="sudoku-field-93-label" class="sudoku-field">
</label>
</td>
<td class="even col-4">
<input type="radio" id="sudoku-field-94", name="sudoku-field" value="94" class="sudoku-field"/>
<label for="sudoku-field-94" id="sudoku-field-94-label" class="sudoku-field">
</label>
</td>
<td class="odd col-5">
<input type="radio" id="sudoku-field-95", name="sudoku-field" value="95" class="sudoku-field"/>
<label for="sudoku-field-95" id="sudoku-field-95-label" class="sudoku-field">
</label>
</td>
<td class="even col-6">
<input type="radio" id="sudoku-field-96", name="sudoku-field" value="96" class="sudoku-field"/>
<label for="sudoku-field-96" id="sudoku-field-96-label" class="sudoku-field">
</label>
</td>
<td class="odd col-7">
<input type="radio" id="sudoku-field-97", name="sudoku-field" value="97" class="sudoku-field"/>
<label for="sudoku-field-97" id="sudoku-field-97-label" class="sudoku-field">
</label>
</td>
<td class="even col-8">
<input type="radio" id="sudoku-field-98", name="sudoku-field" value="98" class="sudoku-field"/>
<label for="sudoku-field-98" id="sudoku-field-98-label" class="sudoku-field">
</label>
</td>
<td class="odd col-9">
<input type="radio" id="sudoku-field-99", name="sudoku-field" value="99" class="sudoku-field"/>
<label for="sudoku-field-99" id="sudoku-field-99-label" class="sudoku-field">
1
</label>
</td>
</tr>
</table>
</div>
<div id="sudoku-input">
<table>
<tr>
<td><input type="submit" value="1" name="number" /></td>
<td><input type="submit" value="2" name="number" /></td>
<td><input type="submit" value="3" name="number" /></td>
</tr>
<tr>
<td><input type="submit" value="4" name="number" /></td>
<td><input type="submit" value="5" name="number" /></td>
<td><input type="submit" value="6" name="number" /></td>
</tr>
<tr>
<td><input type="submit" value="7" name="number" /></td>
<td><input type="submit" value="8" name="number" /></td>
<td><input type="submit" value="9" name="number" /></td>
</tr>
</table>
</div>
</form>
</main>
</body>
</html>
Reference in a new issue Copy permalink