<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:fragment="head-fragment" th:with="finalTitle=${title==null?'':(titleAfter == true?(' - ' + title):(title + ' - '))}">
    <meta charset="utf-8">
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="description" th:content="${@siteConfig.description}">
    <meta http-equiv="Window-target" content="_top" />
    <title th:text="${titleAfter == true? (@siteConfig.name + finalTitle):(finalTitle + @siteConfig.name)}"></title>
    <link rel="shortcut icon" th:href="@{/favicon.ico}" />
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <!-- <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Varela+Round&family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet"> -->
    <link href="https://fonts.googleapis.com/css2?family=Varela+Round&family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
    <link rel="stylesheet" th:href="@{/blog/sketch/css/index.css}">
    <link rel="stylesheet" th:href="@{/blog/sketch/css/post-list.css}">
    <link rel="stylesheet" th:href="@{/blog/sketch/css/has.css}">
    <link rel="stylesheet" th:href="@{/blog/sketch/css/footer.css}">
    <link rel="stylesheet" th:href="@{/blog/sketch/css/prism/navy.css}">
    <link rel="stylesheet" th:href="@{/blog/plugins/katex/0.15.2/katex.min.css}">
    <script th:src="@{/blog/plugins/katex/0.15.2/katex.min.js}"></script>
    <script th:src="@{/blog/plugins/mermaid/9/mermaid.min.js}"></script>
    <script th:src="@{/blog/plugins/jquery/1.12.4/jquery-1.12.4.min.js}"></script>
    <script defer th:src="@{/blog/sketch/js/index.js}"></script>
    <script th:src="@{/blog/sketch/js/prism.js}"></script>
    <script th:src="@{/blog/sketch/js/clipboard.min.js}"></script>
</head>
<div th:fragment="burger" class="burger burger-close">
        <div class="x"></div>
        <div class="y"></div>
        <div class="z"></div>
</div>
<div th:fragment="sidebar-container" class="sidebar-container">
    <div class="sidebar">
        <div th:replace="~{blog/sketch/side::side-fragment}"></div>
    </div>
</div>
<header th:fragment="header" class="header">
    <img th:src="@{/blog/sketch/images/plume.svg}" width="35px" height="35px"/>
    <a class="site-name" href="/"
        th:text="${@siteConfig.name}"></a>
    <p
        class="description" 
        th:text="${@siteConfig.description}"></p>
    
    <p th:if="${pageQuery != null && pageQuery.type!=null}" class="archive-title">
        <th:block th:if="${pageQuery.type=='tag'}">
            标签 <span th:text="${pageQuery.displayName}"></span> 下的文章
        </th:block>
        <th:block th:if="${pageQuery.type=='category'}">
            分类 <span th:text="${pageQuery.displayName}"></span> 下的文章
        </th:block>
        <th:block th:if="${pageQuery.type=='search'}">
            包含关键字 <span th:text="${pageQuery.displayName}"></span> 的文章
        </th:block>
    </p>
    <p class="link-back2top" style="display:none"><a href="#" title="Back to top">Back to top</a></p>
</header>
</html>