{{define "head"}}
<title>Blog - ari melody 💫</title>
<link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/admin/static/blog.css">
{{end}}

{{define "content"}}
<main>
    <header>
        <h1>Blog Posts <small>({{.TotalPosts}} total)</small></h2>
        <a class="button new" id="create-post">Create New</a>
    </header>

    {{if .Collections}}
    <div class="blog-group">
        {{range .Collections}}
        {{if .Posts}}
        <div class="blog-collection">
            <h2>{{.Year}}</h2>
            {{range .Posts}}
            {{block "blogpost" .}}{{end}}
            {{end}}
        </div>
        {{end}}
        {{end}}
    </div>
    {{else}}
    <p>There are no blog posts.</p>
    {{end}}
</main>

<script type="module" src="/admin/static/blog.js"></script>
{{end}}