{{define "title"}}{{.Site.Title}}{{end}}

{{define "content"}}

{{if eq .Page 1}}

<div class="hero-image">

    <!-- <img src="/images/ehc/we-are-family-team-short.webp" alt="EHC Essen (Ruhr) e.V. - We Are Family"> -->

    <img src="/images/ehc/we-are-family-v2.webp" alt="EHC Essen (Ruhr) e.V. - We Are Family">

</div>

<section class="partner-section">

    <div class="section-head">

        <h2>Unsere Partner</h2>

        <a href="/sites/partner/" class="all-link">Alle Partner anzeigen &rarr;</a>

    </div>

    <!-- Partner-Karussell-Widget; lädt /static/data/partners.json -->

    <div id="partner-carousel" data-visible="3" data-interval="3500" aria-label="Partner Karussell"></div>

    <div id="partner-carousel-dots" class="carousel-dots"></div>

    <script src="/static/js/partner-carousel.js" defer></script>

</section>

{{end}}

<section class="section">

    <div class="section-head">

        <h2>News</h2>

        {{if gt .TotalPages 1}}<a href="{{pageURL 2}}" class="all-link">Ältere News &rarr;</a>{{end}}

    </div>

    <div class="post-list">

        {{range .Posts}}

        <article class="post-card">

            {{if .GetCover}}

            <a href="/posts/{{.Slug}}/" class="post-card-cover">

                <img src="{{.GetCover}}" alt="{{.Title}}" loading="lazy">

            </a>

            {{end}}

            <div class="post-card-body">

                <div class="post-card-meta">

                    <time datetime="{{isoDate .Date.Time}}">{{formatDate .Date.Time}}</time>

                    <div class="post-tags">

                        {{range .Tags}}<a href="/tags/{{lower .}}/" class="tag">{{.}}</a>{{end}}

                    </div>

                </div>

                <h2 class="post-card-title"><a href="/posts/{{.Slug}}/">{{.Title}}</a></h2>

                <p class="post-card-preview">{{.GetPreview}}</p>

                <a href="/posts/{{.Slug}}/" class="read-more">Weiterlesen &rarr;</a>

            </div>

        </article>

        {{end}}

    </div>

</section>

{{if gt .TotalPages 1}}

<nav class="pagination">

    {{if gt .Page 1}}<a href="{{pageURL (sub .Page 1)}}" class="pagination-btn pagination-prev">&larr; Neuere</a>

    {{else}}<span class="pagination-btn pagination-prev disabled">&larr; Neuere</span>{{end}}

    <div class="pagination-pages">

        {{range paginationRange $.Page $.TotalPages}}

        {{if isEllipsis .}}<span class="pagination-ellipsis">&hellip;</span>

        {{else if eq . $.Page}}<span class="pagination-num active">{{.}}</span>

        {{else}}<a href="{{pageURL .}}" class="pagination-num">{{.}}</a>{{end}}

        {{end}}

    </div>

    {{if lt .Page .TotalPages}}<a href="{{pageURL (add .Page 1)}}" class="pagination-btn pagination-next">Ältere &rarr;</a>

    {{else}}<span class="pagination-btn pagination-next disabled">Ältere &rarr;</span>{{end}}

</nav>

{{end}}

{{end}}