{{define "content"}}
<div class="home">
  {{with index .Settings "author_bio"}}
  <section class="profile">
    {{with index $.Settings "author_avatar"}}
    <img src="{{.}}" alt="{{$.SiteName}}" class="profile-avatar">
    {{end}}
    <p class="profile-bio">{{.}}</p>
  </section>
  {{end}}

  <section class="posts-list">
    {{range .Posts}}
    <article class="post-card">
      <a href="/posts/{{.Slug}}">
        <h2 class="post-card-title">{{.Title}}</h2>
        <time class="post-card-date" datetime="{{.Date.Format "2006-01-02"}}">{{.Date.Format "January 2, 2006"}}</time>
        {{if .Description}}
        <p class="post-card-description">{{.Description}}</p>
        {{end}}
      </a>
    </article>
    {{else}}
    <p class="no-posts">No posts yet.</p>
    {{end}}
  </section>

  {{if .HasMore}}
  <nav class="pagination">
    <a href="/posts" class="view-all">View all posts</a>
  </nav>
  {{end}}
</div>
{{end}}