<!DOCTYPE html>
<html lang="pl" 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 method="post">
	<p>Wprowadź liczby i wybierz działanie</p>
	<input type="number" name="liczba1" id="liczba1" th:value="${param.liczba1}">
	<select id="operacja" name="operacja">
		<option value="+" th:selected="${operacja == '+'}">+</option>
		<option value="-" th:selected="${operacja == '-'}">-</option>
		<option value="*" th:selected="${operacja == '*'}">*</option>
		<option value="/" th:selected="${operacja == '/'}">/</option>
	</select>
	<input type="number" name="liczba2" id="liczba2" th:value="${param.liczba2}">
	<button>Oblicz</button>
</form>

<div th:if="${wynik != null}" class="wynik">
	<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>
</body>
</html>
