{{ define "main" }}
<header class="page-head wrap">
    <h1 class="display display--xl">{{ .Title }}</h1>
    {{ with .Content }}<div class="page-head__lead">{{ . }}</div>{{ end }}
</header>

<section class="wrap release">
    {{ with .Params.album }}
    <div class="release__album">
        <p class="release__kind">{{ .kind }}, {{ .year }}</p>
        <h2 class="release__title">{{ .title }}</h2>
        {{ with .text }}<p class="release__text">{{ . }}</p>{{ end }}
        <a class="button button--bolt" href="{{ site.Params.spotify }}" target="_blank" rel="noopener">Auf Spotify hören</a>
    </div>
    {{ end }}
    <div class="release__player">
        {{ partial "spotify.html" . }}
    </div>
</section>

{{ with .Params.singles }}
<section class="wrap singles" aria-labelledby="singles">
    <h2 id="singles" class="display">Singles</h2>
    <ol class="tracklist">
        {{ range . }}
        <li>
            <span class="tracklist__title">{{ .title }}</span>
            {{ with .year }}<span class="tracklist__year">{{ . }}</span>{{ end }}
        </li>
        {{ end }}
    </ol>
</section>
{{ end }}

<section class="wrap elsewhere" aria-labelledby="elsewhere">
    <h2 id="elsewhere" class="display">Mehr von uns</h2>
    <ul class="elsewhere__list">
        <li><a href="{{ site.Params.spotify }}" target="_blank" rel="noopener"><strong>Spotify</strong> Alle Songs und das Album</a></li>
        <li><a href="{{ site.Params.youtube }}" target="_blank" rel="noopener"><strong>YouTube</strong> Videos und Live-Mitschnitte</a></li>
        <li><a href="{{ site.Params.instagram }}" target="_blank" rel="noopener"><strong>Instagram</strong> Neuigkeiten aus dem Proberaum</a></li>
    </ul>
</section>
{{ end }}