{{ define "main" }}
    <div class="container mx-auto px-4 py-8">
        <div class="lg:flex">
            <div class="lg:w-3/12 pr-8">
                {{ partial "blog/sidebar.html" . }}
            </div>

            <div class="lg:w-7/12">
                {{ $authorData := index $.Site.Data.team.team .Data.Term }}
                {{ $blogPosts := where .Data.Pages "Section" "blog" }}
                {{ $paginator := .Paginate $blogPosts.ByDate.Reverse }}


                <header>
                    <div class="flex items-top">
                        <span class="rounded-full mr-4 lg:mr-6">
                            <img class="rounded-full w-32 bg-blue-200 p-1" src="/images/team/{{ $authorData.id }}.jpg" alt="{{ $authorData.name }}" />
                        </span>
                        <div>
                            <h1 class="no-anchor mb-0">{{ $authorData.name }}</h1>
                            <div>
                                {{ if eq $authorData.status "guest" }}
                                    <span class="rounded-full bg-blue-200 px-2 py-1 text-xs font-bold mr-3">Guest</span>
                                {{ end }}
                                <span class="text-sm text-gray-700">
                                    {{ $authorData.title }}
                                </span>
                            </div>
                            <span>
                                {{ if $authorData.social }}
                                    {{ partial "widgets/social-icons.html" (dict "social" $authorData.social) }}
                                {{ end }}
                            </span>
                        </div>
                    </div>
                </header>

                {{ range $paginator.Pages }}
                    <article class="my-8 pb-8 border-b border-gray-200">
                        <h2 class="no-anchor"><a data-track="{{ .Title | urlize }}" href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
                        <div class="flex items-center">
                            <time class="text-sm text-gray-700">
                                {{ .Date.Format "Monday, Jan 2, 2006" }}
                            </time>
                        </div>
                        <section>
                            {{ partial "blog/poster" . }}
                            {{ partial "blog/summary" . }}
                        </section>
                    </article>
                {{ end }}

                {{ partial "blog/paginator.html" . }}
            </div>

            <div class="lg:w-2/12 pl-8"></div>
        </div>
    </div>
{{ end }}