{{- $posts := .posts }}
{{- $pages := .pages }}
{{- $defaultimage := .defaultimage }}
{{- $odd     := .odd }}
{{- $id := "posts"}}
{{if $posts.id}}
    {{- $id = $posts.id}}
{{else if .id}}
    {{- $id = .id }}
{{end}}
<div id="{{ $id }}" class="section {{if eq $odd 0}} section-even {{end}}">
    <div class="section-content posts">
        <div class="title">
            <h1 class="content-title">{{ $posts.title }}</h1>
            <div class="divider"></div>
        </div>
        <div class="cardList">
            {{ range first 3 $pages }}
                <div class="card">
                    <a href="{{.Permalink}}">
                        <div class="cardContent">
                            {{ if .Params.image }}
                                <img class="cardImage {{ if eq .Params.image.cover false }} noCover {{ end }}" alt="{{ .Params.image.alt }}" src="{{ .Params.image.url }}" />
                            {{ else }}
                                <img class="cardImage" src="{{ $defaultimage }}" alt="Defaul Image" />
                            {{ end }}
                            <div class="cardTitle">{{.Title}}</div>
                            <div class="cardDescription">{{ .Summary | safeHTML | truncate 320 }}</div>
                            <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
                        </div>
                    </a>
                </div>
            {{ end }}
        </div>
        <div class="more-button"><a href="{{ $posts.id }}"> {{ $posts.moretext }} </a></div>
    </div>
</div>