2025-12-09 17:50:06 +09:00

36 lines
1.4 KiB
HTML

<!DOCTYPE html>
<html
xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
xmlns:sec="http://www.thymeleaf.org/extras/spring-security"
layout:decorate="~{layout/default_layout}"
>
<th:block layout:fragment="head" id="head">
</th:block >
<th:block layout:fragment="content">
<div class="game-body-wrapper">
<h1>Nonogram Logic</h1>
<div class="game-play-box wide">
<div id="game-controls" style="margin: 0 0 20px 0; width:100%; display:flex; justify-content:space-between;">
<div id="mode-selector">
<label><input type="radio" name="play-mode" value="fill" checked><span>Fill</span></label>
<label><input type="radio" name="play-mode" value="mark"><span>Mark</span></label>
</div>
<div id="points-info" class="score-board">❤️ <span id="points-display">5</span></div>
<button id="hint-btn">Hint</button>
</div>
<div id="board-viewport">
<div id="game-board"></div>
<img id="grayscale-reveal" class="reveal-img" src="" alt="">
<img id="original-reveal" class="reveal-img" src="" alt="">
</div>
</div>
</div>
<script th:inline="javascript">
window.puzzleData = /*[[${puzzle}]]*/ null;
</script>
<script type="module" th:src="@{/js/pages/game_nonogram.js}"></script>
</th:block>
</html>