{{ define "main" }}
<div class="container mx-auto">
    <p class="text-2xl font-medium leading-loose text-forest mb-1">List of projects</p>
    <div class="inline-flex mb-8">
        {{$currentpage := .Page.Title}}
        {{ $section := "projects" }}
        {{ range (where .Site.RegularPages.ByTitle "Section" $section ) }}
        {{ if eq $currentpage .Page.Title}}
        <a href="{{ .Permalink }}" class="inline-flex items-center px-4 py-3 border bg-forest border-forest">
            <span class="h-full text-xl font-medium leading-7 text-center  text-white">{{ .Params.title | humanize |
                title }}</span>
        </a>
        {{ else }}
        <a href="{{ .Permalink }}"
            class="inline-flex items-center px-4 py-3 border border-forest text-forest hover:bg-forest hover:text-white">
            <span class="h-full text-xl font-medium leading-7 text-center">{{ .Params.title | humanize | title }}</span>
        </a>
        {{ end }}
        {{ end }}
    </div>
    <div class="flex mt-9">
        <aside>
            <div class="underline text-xl leading-7 text-forest mt-7">
                {{ .Page.TableOfContents }}
            </div>
        </aside>
        <div class="max-w-2xl mx-auto">
            <div class="inline-flex items-center justify-start px-8 py-4 mb-4 bg-salmon w-full">
                <h1 class="flex-1 w-full text-2xl font-medium leading-loose text-almost-white">{{.Title}}</h1>
            </div>

            <section class="prose prose-lg">
                <div>
                    <article>
                        {{ .Content }}
                    </article>
                </div>
            </section>
        </div>
    </div>
</div>


<aside id="meta">
    <div>
        <section>
            <h4 id="date"> {{ .Date.Format "Mon Jan 2, 2006" }} </h4>
            <h5 id="wordcount"> {{ .WordCount }} Words </h5>
        </section>
        {{ with .Params.topics }}
        <ul id="topics">
            {{ range . }}
            <li><a href="{{ " topics" | absURL}}{{ . | urlize }}">{{ . }}</a> </li>
            {{ end }}
        </ul>
        {{ end }}
        {{ with .Params.tags }}
        <ul id="tags">
            {{ range . }}
            <li> <a href="{{ " tags" | absURL }}{{ . | urlize }}">{{ . }}</a> </li>
            {{ end }}
        </ul>
        {{ end }}
    </div>
    <div>
        {{ with .PrevInSection }}
        <a class="previous" href="{{.Permalink}}"> {{.Title}}</a>
        {{ end }}
        {{ with .NextInSection }}
        <a class="next" href="{{.Permalink}}"> {{.Title}}</a>
        {{ end }}
    </div>
</aside>
{{ end }}