<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="utf-8">
        <title>
            回复通知邮件退订
        </title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <style>
            body {
                background-color: #f8f9fa;
                color: #aaa;
                font: 14px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;
            }
            .note {
                text-align: center;
                padding: 110px 0;
                min-height: 100%;
            }
            .note-header, .note-footer {
                max-width: 400px;
                margin: 0 auto;
            }
            .note-header>h2 {
                margin-bottom: 10px;
                font-weight: 400;
                font-size: 30px;
                color: #000;
            }
            .note-footer>p {
                text-align: justify;
            }
            .note-panel {
                color: #000;
                border-radius: 5px;
                margin: 20px auto;
                width: 50%;
                max-width: 400px;
                padding: 20px; 
                background-color: white;
                box-shadow: 0 0 0 0.5px rgba(188, 195, 206, 0.1), 0 2px 10px rgba(48, 55, 66, 0.06);
            }
            .note-panel>div {
                text-align: left;
            }
            .note-panel>p {
                color: red;
            }
        </style>
    </head>
    
    <body>
        <div class="note">
            <div>
                <div class="note-header">
                    <h2>
                        Doghouse
                    </h2>
                    <p> 
                        回复通知邮件退订
                    </p>
                </div>
                <form class="note-panel" method="post">
                    <div th:if="${mail != null && !#strings.isEmpty(mail)}">取消该邮箱<span th:text="${mail}"></span>在全站所有评论的通知（若开启过）</div>
                    <p th:if="${note != null && !#strings.isEmpty(note)}" th:text="${note}"></p>
                    <button th:if="${mail != null && !#strings.isEmpty(mail)}">提交</button>
                </form>
            </div>
            <div class="note-footer">
                <p>
                    提交完成后不可撤销，若需重新接收回复邮件，请进行新的一条评论，并勾选允许接收新回复邮件通知。
                若自动回复通知邮件打扰到您，十分抱歉。
                </p>
                &copy;2016-[[${#temporals.format(T(java.time.LocalDate).now(),'yyyy')}]]
                <a href="/" target="_blank">
                    Doghole</a>
                All Rights Reserved.
            </div>
        </div>
    </body>

</html>