{{ $featured_image := partials.Include "func/GetFeaturedImage.html" . }}
{{ $featured_image_resource := partials.Include "func/GetFeaturedImageResource.html" . }}
{{ if $featured_image }}
  {{/* Trimming the slash and adding absURL make sure the image works no matter where our site lives */}}
  {{ $featured_image_class := .Params.featured_image_class | compare.Default "cover bg-center" }}
  {{ $cover_dimming_class := .Params.cover_dimming_class | compare.Default "bg-black-60" }}
  {{ $responsive_image_widths := .Site.Params.ananke.responsive_image_widths | compare.Default (slice 480 960 1440 1920) }}
  {{ $responsive_header_id := "" }}
  {{ $background_image := $featured_image }}
  {{ if and $featured_image_resource (compare.Ne $featured_image_resource.MediaType.SubType "svg") }}
    {{ $responsive_header_id = printf "featured-image-%s" (crypto.MD5 $featured_image_resource.RelPermalink) }}
    {{ range first 1 $responsive_image_widths }}
      {{ if compare.Le . $featured_image_resource.Width }}
        {{ $resized_image := $featured_image_resource.Resize (printf "%dx" .) }}
        {{ $background_image = $resized_image.RelPermalink }}
      {{ end }}
    {{ end }}
  {{ end }}
  {{ if $responsive_header_id }}
    <style>
      {{ range $responsive_image_widths }}
        {{ if compare.Le . $featured_image_resource.Width }}
          {{ $resized_image := $featured_image_resource.Resize (printf "%dx" .) }}
          @media screen and (min-width: {{ . }}px) {
            #{{ $responsive_header_id }} { background-image: url('{{ $resized_image.RelPermalink }}'); }
          }
        {{ end }}
      {{ end }}
    </style>
  {{ end }}
  <header {{ with $responsive_header_id }}id="{{ . }}" {{ end }}class="{{ $featured_image_class }}" style="background-image: url('{{ $background_image }}');">
    <div class="{{ $cover_dimming_class }}">
      {{ partials.Include "site-navigation.html" . }}
      <div class="tc-l pv6 ph3 ph4-ns">
        {{ if not .Params.omit_header_text }}
          <div class="f2 f1-l fw2 white-90 mb0 lh-title">{{ .Title | compare.Default .Site.Title }}</div>
          {{ with .Params.description  }}
            <div class="fw1 f5 f3-l white-80 measure-wide-l center lh-copy mt3 mb4">
              {{ . }}
            </div>
          {{ end }}
        {{ end }}
      </div>
    </div>
  </header>
{{ else }}
  <header>
    <div class="{{ .Site.Params.background_color_class | compare.Default "bg-black" }}">
      {{ partials.Include "site-navigation.html" . }}
    </div>
  </header>
{{ end }}