{% import "post.html" as post -%}
<!-- vim: set ft=html: -->


<!DOCTYPE HTML>
<html lang="{%- if config.default_language -%}{{ config.default_language }}{%- else -%}en{%- endif -%}">
    <head>
        <title>{%- block title %}{{ config.title }}{% endblock title -%}</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">


        <link rel="alternate" type="application/rss+xml" title="RSS" href="{{ get_url(path="rss.xml") | safe }}">

          {% if config.extra.katex_enable %}
          <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css" integrity="sha384-9eLZqc9ds8eNjO3TmqPeYcDj8n+Qfa4nuSiGYa6DjLNcv9BtN69ZIulL9+8CqC9Y" crossorigin="anonymous">
          <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css" integrity="sha384-9eLZqc9ds8eNjO3TmqPeYcDj8n+Qfa4nuSiGYa6DjLNcv9BtN69ZIulL9+8CqC9Y" crossorigin="anonymous">

          <script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.js" integrity="sha384-K3vbOmF2BtaVai+Qk37uypf7VrgBubhQreNQe9aGsz9lB63dIFiQVlJbr92dw2Lx" crossorigin="anonymous"></script>
          <script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/contrib/mathtex-script-type.min.js" integrity="sha384-zWYbd0NBwgTsgIdFKVprSfTh1mbMPe5Hz1X3yY4Sd1h/K1cQoUe36OGwAGz/PcDy" crossorigin="anonymous"></script>
          {% if config.extra.katex_auto_render %}
      <script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/contrib/auto-render.min.js" integrity="sha384-kmZOZB5ObwgQnS/DuDg6TScgOiWWBiVt0plIRkZCmE6rDZGrEOQeHM5PcHi+nyqe" crossorigin="anonymous"
              onload="renderMathInElement(document.body);"></script>
          {% endif %}
          {% endif %}

          {% if config.extra.tikz_enable %}
          <link rel="stylesheet" type="text/css" href="https://tikzjax.com/v1/fonts.css">
          <script src="https://tikzjax.com/v1/tikzjax.js"></script>
          {% endif %}


        {%- if config.extra.favicon %}
        <link rel="shortcut icon" type="{{ config.extra.favicon_mimetype | default(value="image/x-icon") }}" href="{{ config.extra.favicon | safe }}">
        {%- endif %}
        {%- block extra_head %}
        {%- endblock extra_head %}

    <style>
    @import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1&display=swap');
            /*
            @font-face {
                font-family: "UtsukushiMincho";
                src: url(/UtsukushiMincho.ttf);
            }
            */

            body {
                font-family: "Shippori Mincho B1";
                {%- if config.extra.base00 %}
                background-color: {{ config.extra.base00 }};
                {% else %}
                background-color: #faf4ed;
                {% endif -%}

                {%- if config.extra.base05 %}
                color: {{ config.extra.base05 }};
                {% else %}
                color: #575279;
                {% endif -%}
                display: flex;
                justify-content: center;
                align-items: center;
                align-content: center;
                flex-direction: column;
                max-height: 1000000000px;
            }

            .main {
                width: 50%;
                display: flex;
                align-items: center;
                flex-direction: column;
                justify-content: center;
                text-size-adjust: auto !important;
                -webkit-text-size-adjust: auto !important;
                -moz-text-size-adjust: auto !important;
                -ms-text-size-adjust: auto!important;
            }

            @media only screen and (max-width: 992px) {
                .main {
                    width: 90%;
                }
            }


            .header_title {
                font-weight: bolder;
                font-size: 44.8px;

            }

            .header {
                width: 100%;
                margin-top: 7rem;
                padding-top: 1rem;
                padding-left: 1rem;
                padding-bottom: 1.5rem;
                border-radius: 5px;
                {%- if config.extra.base05 %}
                border: solid {{ config.extra.base05 }};
                {% else %}
                border: solid #575279;
                {% endif -%}
            }

            @media only screen and (max-width: 768px) {
                .header {
                    padding-right: 1rem;
                    margin-top: 3rem;
                }

                .header_title {
                    margin: auto;
                }
            }

            .menu_inner {
                list-style: none;
                margin: 0;
                font-weight: bold;
                font-size: 1.2rem;
                padding: 0.1rem;
                padding-top: 0.5rem;
                padding-left: 0.3rem;
                display: flex;
                flex-wrap: wrap;
            }

            .menu_list {
                margin-right: 20px;
            }

            .menu_item {

                {%- if config.extra.base0e %}
                color: {{ config.extra.base0e }};
                {% else %}
                color: #907aa9;
                {% endif -%}
            }

            .pagination {
                margin-top: 50px;
            }

            .pagination_buttons {
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .pag_button {
                border-radius: 10px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 1.1rem;
                appearance: none;
                padding: 0;
                max-width: 80%;
            }

            .pagination_link {
                display: flex;
                white-space: nowrap;
                overflow: hidden;
            }

            .button_text {
                padding: 8px 16px;
                text-decoration: none;
                white-space: nowrap;
                overflow: hidden;
                {%- if config.extra.base0d %}
                color: {{ config.extra.base0d }};
                {% else %}
                color: #286983;
                {% endif -%}
            }

            .footer {
                width: 100%;
                flex-grow: 0;
                padding: 40px 0;
            }
 
            .arial {
                font-family: Arial;
            }

            .content {
                width: 100%;
            }
            .post {
                font-size: 1.1rem;
            }

            .post_contents a {
                {%- if config.extra.base0d %}
                color: {{ config.extra.base0d }};
                {% else %}
                color: #286983;
                {% endif -%}
            }

            .post_contents a:visited {
                {%- if config.extra.base0e %}
                color: {{ config.extra.base0e }};
                {% else %}
                color: #907aa9;
                {% endif -%}
            }

            .post_contents pre {
                padding: 12px;
                overflow: auto;
            }

            .post_contents pre[data-linenos] {
                padding: 12px 0;
            }

            .post_contents pre table td {
                padding: 0;
                padding-right: 3px;
                padding-left: 3px;
            }

            .post_contents pre table td:nth-of-type(1) {
                text-align: center;
                user-select: none;
            }

            .post_contents pre mark {
                display: block;
            }

            .post_contents pre table {
                width: 100%;
                border-collapse: collapse;
            }

            .post_contents img {
                display: block;
                max-width: 100%;
            }

            .post_contents img.left {
                margin-right: auto;
            }

            .post_contents img.center {
                margin-left: auto;
                margin-right: auto;
            }

            .post_contents img.right {
                margin-left: auto;
            }

            .post_contents .tikz-left {
                margin-right: auto;
            }

            .post_contents .tikz-center {
                margin-left: auto;
                margin-right: auto;
            }

            .post_contents .tikz-right {
                margin-left: auto;
            }

            .post_contents blockquote {
                {%- if config.extra.base09 %}
                border-left: 3px solid {{ config.extra.base09 }};
                {% else %}
                border-left: 3px solid #ea9d34;
                {% endif -%}
                padding-left: 10px;
                margin-left: 0px;
            } 

            hr {
                border: none;
                height: 1px;
                {%- if config.extra.base03 %}
                background: {{ config.extra.base03 }};
                {% else %}
                background: #9893a5;
                {% endif -%}

            }

            .post_link {
                {%- if config.extra.base0c %}
                color: {{ config.extra.base0c }};
                {% else %}
                color: #56949f;
                {% endif -%}
                text-decoration: none;
            }

            .post_title {
                font-weight: bolder;
                font-size: 2.2rem;
                padding-bottom: 10px;
                padding-top: 25px;
                {%- if config.extra.base0c %}
                border-bottom: 2px solid {{ config.extra.base0c }};
                {% else %}
                border-bottom: 2px solid #56949f;
                {% endif -%}
            }

            .post_meta {
                font-weight: bold;
                {%- if config.extra.base04 %}
                color: {{ config.extra.base04 }};
                {% else %}
                color: #797593;
                {% endif -%}
            }

            .post_tag {
                {%- if config.extra.base04 %}
                color: {{ config.extra.base04 }};
                {% else %}
                color: #797593;
                {% endif -%}
            }

            .post_list_link {
                text-decoration: none;
            }

            .post_date {
                {%- if config.extra.base0c %}
                color: {{ config.extra.base0c }};
                {% else %}
                color: #56949f;
                {% endif -%}
                text-decoration: none;
            }

            .post_list_title {
                {%- if config.extra.base05 %}
                color: {{ config.extra.base05 }};
                {% else %}
                color: #575279;
                {% endif -%}
            }

            .show_all_tags {
                font-weight: bold;
                {%- if config.extra.base05 %}
                color: {{ config.extra.base05 }};
                {% else %}
                color: #575279;
                {% endif -%}
            }

            .tag_list {
                list-style: none;
                padding-left: 0;
            }

            .tag_item {
                font-weight: bold;
                {%- if config.extra.base04 %}
                color: {{ config.extra.base04 }};
                {% else %}
                color: #797593;
                {% endif -%}
                text-decoration: none;
            }

            .button_read_more {
                float: right;
                text-decoration: none;
            }

            .pagination_link {
                text-decoration: none;
            }

            .postview_title_text {
                padding: 5px 10px;
                margin: 0;
                font-size: 0.9rem;
                text-transform: uppercase;
                letter-spacing: 0.2rem;
                text-align: center;
                justify-content: center;
            }


            .pagination_title {
                display: grid;
                align-items: center;
            }

    </style>
    </head>

    <body>
     <div class="main">
            {% block header %}
            <div class="header">

                <div class="header_title">
                    {% block title_content %}
                    {%- if config.extra.title_text %}
                        {{ config.extra.title_text }}
                    {% elif config.title %}
                        {{ config.title }}
                    {% else %}
                        Dawn Theme
                    {% endif -%}
                    {% endblock title_content %}
                </div>

                {% block header_menu %}
                <div class="header_menu">
                    <nav class="header_nav">
                        <ul class="menu_inner">
                            {% for item in config.extra.menu %}
                            <li class = "menu_list">
                                <a class = "menu_item" href="{{ item.url | replace(from="$BASE_URL", to=config.base_url) }}">
                                    {{ item.name }}
                                </a>
                            </li>
                            {% endfor %}
                        </ul>
                    </nav>
                </div>
                {% endblock header_menu %}

            </div>
            {% endblock header %}


            <div class="content">
                {% block content %}
                <div class="posts">
                    {%- if paginator %}
                        {%- set show_pages = paginator.pages -%}
                    {% else %}
                        {%- set show_pages = section.pages -%}
                    {% endif -%}

                    {%- for page in show_pages %}
                        <div class="post on-list">
                            {{ post::header(page=page, summary=true) }}
                            {{ post::content(page=page, summary=true) }}
                        </div>
                    {% endfor -%}

                <div class="pagination">
                    <div class="pagination_buttons">
                        {%- if paginator.previous %}
                        <span class="pag_button next">
                            <a class="pagination_link" href="{{paginator.previous | safe }}">
                                <span class="button_text"><span class="arial">&#8656;</span>  Newer posts</span>
                            </a>
                        </span>
                        {% endif -%}
                        {%- if paginator.next %}
                        <span class="pag_button previous">
                            <a class="pagination_link" href="{{paginator.next | safe }}">
                                <span class="button_text">Older posts  <span class="arial">&#8658;</span></span>
                            </a>
                        </span>
                        {% endif -%}
                    </div>
                </div>
            </div>
            {% endblock content %}
            </div>

            {% block footer %}
            <footer class="footer">
                <div class="footer_inner">
                    {%- if config.extra.extra_copyright %}
                        <div class="copyright">{{ config.extra.extra_copyright | safe }}</div>
                    {% else %}
                    <div class="copyright">
                        <span>
                            <span class="arial">&#169;</span> {{ now() | date(format="%Y") }} {{ config.extra.author }}</span>
                    </div>
                    {% endif -%}
                </div>
            </footer>
            {% endblock footer %}
        </div>
    </body>
</html>
