<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
    th:with="theme=${CookieUtils.getCookieValue(request, 'theme')}"
    th:class="${#arrays.contains({'dark', 'bright', 'auto'}, theme) ? theme : 'auto'}">
<head th:replace="~{blog/bleaching/header::head-fragment}"></head>
<link rel="stylesheet" th:href="@{/blog/bleaching/css/comment.css}">
<body>
    <div class="side-click-mask"></div>
    <div th:replace="~{blog/bleaching/header::header}"></div>
    <div class="move-block">
        <div class="main-and-side">
            <main>
                <article class="post">
                    <header>
                        <section class="author">
                            <div class="author-ava">
                                <img
                                    th:src="@{/blog/bleaching/images/logo.svg}"
                                    referrerpolicy="same-origin"
                                    alt="Doghole" width="155" height="114">
                            </div>
                        </section>
                    </header>
                    <div class="post-content" th:utext="${@markdownService.renderPostContent(post)}">
                    </div>
                </article>
                <div class="comment-area" th:attr="post-id=${post.postId}">
                    <hr class="comment-hr">
                    <div class="comment-page"
                        th:insert="~{blog/bleaching/comment-only}"></div>
                    <comment th:replace="~{blog/bleaching/comment::reply-comment}"></comment>
                </div>
                <footer th:replace="~{blog/bleaching/footer::footer}"></footer>
            </main>
            <div th:replace="~{blog/bleaching/header::sidebar-container}"></div>
        </div>
    </div>
    <script th:src="@{/blog/bleaching/js/menu.js}"></script>
    <script th:src="@{/blog/bleaching/js/post.js}"></script>
    <script th:src="@{/blog/bleaching/js/comment.js}"></script>
</body>
</html>