{{ $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 }}
|
