<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Kalkulator</title>
<link rel="stylesheet" type="text/css" th:href="@{/styl.css}" href="../static/styl.css">
</head>
<body>
<h1>Kalkulator</h1>

<form class="kalkulator" method="post">
<input type="number" name="liczba1" th:value="${param.liczba1}">

<select name="operacja">
	<option value="+">+</option>
	<option value="-">-</option>
	<option value="*">×</option>
	<option value="/">÷</option>
	<option value="%">mod</option>
</select>

<input type="number" name="liczba2" th:value="${param.liczba2}">
<button>Oblicz</button>
</form>

<div class="wynik" th:if="${wynik != null}">
    <span th:text="${param.liczba1}">2</span>
    <span th:text="${param.operacja}">+</span>
    <span th:text="${param.liczba2}">3</span>
    =
    <strong th:text="${wynik}">5</strong>
</div>

<div class="error" th:if="${error != null}" th:text="${error}">
Straszny błąd!
</div>

<div><a href="historia" th:href="@{/kalkulator/historia}">zobacz historię działań</a></div>
<div><a href="historia.json" th:href="@{/historia.json}">historia działań JSON</a></div>

</body>
</html>
