{{ define "header" }}{{ partial "page-header.html" . }}{{ end }}

{{ define "main" }}

{{ partial "navigation-bar.html"  ( dict "context" . "items"  (slice "/" ) )}}

<div class="flex-l mt2 mw8 center">
    <article class="center cf pv5 ph3 ph4-ns mw7">
      <header>
        <div class="flex justify-between">
          <div class=" w-50 ">
            {{- .Params.Sports -}}
          </div>
          <div class=" w-50 tr ">
            {{- .Params.Locations -}}
            {{ partial "formatted-date.html" . }}
          </div>                  
        </div>
        </header>

      {{/* Show facts, if available   */}}
      <div class="nested-copy-line-height lh-copy f4 nested-links nested-img mid-gray">
        {{ if isset .Params "distance_km" }}
        <h1 class="f2">
            Fakten 
        </h1>
        <ul>
            {{ with .Params.distance_km}}
            <li>
              Distanz   : {{ partial "func/NumberFormatter.html" ( dict "number" . "precision" 1 )}} KM
            </li>
            {{ end }}
            {{ with .Params.average_speed_kmh }}
            <li>
                Schnitt   : {{ partial "func/NumberFormatter.html" ( dict "number" . "precision" 1 ) }}   km/h
            </li>
            {{ end }}
            {{ with .Params.ascent_m }}
            <li>
                Aufstieg: {{ partial "func/NumberFormatter.html" ( dict "number" . "precision" 0) }} HM
            </li>
            {{ end }}
            {{ with .Params.avarage_speed }}
            <li>
                Schnitt : {{ printf "%.f" . }} km/h
            </li>
            {{ end }}
            {{ with .Params.temperature_c }}
            <li>
                Temperatur: {{ partial "func/NumberFormatter.html" ( dict "number" . "precision" 1 ) }} °C
            </li>
            {{ end }}
        </ul>
        {{ end }}

        {{ if isset .Params "members" }}
          <h1 class="f2">
            Teilnehmer 
          </h1>
          <div class="nested-copy-line-height lh-copy f4 nested-links nested-img mid-gray">
            {{ $max := add -1 (len .Params.members) }}
            {{ range $index, $member := .Params.members }}
              {{ $member }}{{if lt $index $max }}, {{ end }}
            {{ end}}
          </div>
        {{ end }}

        <h1 class="f2">
          Story 
        </h1>
        <div class="nested-copy-line-height lh-copy f4 nested-links nested-img mid-gray">
          {{ .Content }}
        </div>


        <h1 class="f2">
          Bilder des Tages  
        </h1>
        {{ $page := .}}
        {{ with .Resources.Match "images/*"  }}
          {{ range . }}
            {{ $gallary_img := .Resize "600x" }}
            <div class="pv4  b--black-10 ph3 ph0-l">
              <a href="{{.Permalink}}" class="db ">
              <img style="max-width: 100%; width: auto; height: auto;" src="{{ $gallary_img.RelPermalink }}" 
                width="{{ .Width }}" height="{{ .Height }}" alt="{{ .Title }}" >
                </a>
            {{ if isset $page.Params "captions" }}
              {{ range first 1 (where $page.Params.captions "name" .Name) }}
                {{ .text }}
              {{ end }}
            {{ end }}
          </div>
          {{ end }}
        {{ end }}


      </div>
      <hr>
      {{ partial "social-activity.html" . }}

    </article>
  </div>


  {{ end }}