<!DOCTYPE html>
<html lang="fr" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="fragments.html :: head(#{materialType.add.title}, 'form')"></th:block>

    <link rel="stylesheet" th:href="@{|${baseUrl}/css/forms.css|}"/>
</head>
<body>

<!-- Fragment de l'entête -->
<header th:include="fragments.html :: header(false)"></header>
<!-- Corps de la page -->
<section>
    <div th:include="fragments.html :: messages"></div>
    <h1 th:text="#{materialType.add.title}"></h1>

    <form th:action="@{/materialType/creator}" th:object="${materialType}" class="requireAuth" method="POST">
        <div class="content">
            <div class="formWrap">
                <div class="formColumn">
                    <div>
                        <label th:for="${#ids.next('name')}"
                               th:text="#{materialType.name} + ':'"></label>
                    </div>
                    <div><label th:for="${#ids.next('prefix')}"
                                th:text="#{materialType.prefix} + ' (3 ' + #{keyword.characters} + '):'"></label>
                    </div>
                    <div>
                        <label th:for="${#ids.next('usePercentages')}"
                               th:text="#{materialType.usePercents} + ':'"></label>
                    </div>
                </div>
                <div class="formColumn">
                    <div>
                        <input required
                               class="rawInput"
                               th:field="*{name}"
                               type="text"/>
                    </div>
                    <div>
                        <input maxlength="3"
                               minlength="3"
                               class="rawInput"
                               required
                               th:field="*{prefix}"
                               type="text"/>
                    </div>
                    <div>
                        <input type="checkbox"
                               th:field="*{usePercentages}"/>
                    </div>
                </div>
            </div>
            <div th:include="fragments.html :: formEndButtons"></div>
        </div>
    </form>
</section>
<!-- Fragment du pied de page -->
<footer th:include="fragments.html :: footer(null, true)"></footer>

</body>
</html>
