<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="UTF-8">
    </head>
    <body>
        <!-- flash messages -->
        <div th:fragment="page-notices">
            <div id="error" class="collapse show alert alert-danger" th:if="${error}" >
                <div class="d-flex justify-content-between align-items-center" style="position: relative;">
                    <span th:text="${error}"></span>
                    <span class="btn font-lg" data-toggle="collapse" data-target="#error">&times;</span>
                </div>
            </div>
            <div class="alert alert-danger" th:if="${errors != null && #lists.size(errors) > 0}">
                <ul class="mb-0">
                    <li th:each="error: ${errors}" th:text="${error}"></li>
                </ul>
            </div>
            <div id="success" class="collapse show alert alert-success" th:if="${success}" >
                <div class="d-flex justify-content-between align-items-center" style="position: relative;">
                    <span th:text="${success}"></span>
                    <span class="btn font-lg" data-toggle="collapse" data-target="#success">&times;</span>
                </div>
            </div>
            <div id="warning" class="collapse show alert alert-warning" th:if="${warning}" th:text="${warning}">
                <div class="d-flex justify-content-between align-items-center" style="position: relative;">
                    <span th:text="${warning}"></span>
                    <span class="btn font-lg" data-toggle="collapse" data-target="#warning">&times;</span>
                </div>
            </div>
        </div>
    </body>
</html>