{{ $_hugo_config := `{ "version": 1 }` }}
{{ $blockID := printf "td-cover-block-%d" .Ordinal }}
{{ $promo_image := (.Page.Resources.ByType "image").GetMatch "**background*" }}
{{ $logo_image := (.Page.Resources.ByType "image").GetMatch "**logo*" }}
{{ $col_id := .Get "color" | default "dark" }}
{{ $image_anchor := .Get "image_anchor" | default "smart" }}
{{ $logo_anchor := .Get "logo_anchor" | default "smart" }}
{{/* Height can be one of: auto, min, med, max, full. */}}
{{ $height := .Get "height" | default "max" }}
{{ $byline := .Get "byline" | default "" }}
{{ $link_url := .Get "link_url" | default "#" }}
{{ $link_title := .Get "link_title" | default "Get started" }}
{{ with $promo_image }}
{{ $promo_image_big := (.Fill (printf "1920x1080 %s" $image_anchor)) }}
{{ $promo_image_small := (.Fill (printf "960x540 %s" $image_anchor)) }}

<link rel="preload" as="image" href="{{ $promo_image_small.RelPermalink }}" media="(max-width: 1200px)">
<link rel="preload" as="image" href="{{ $promo_image_big.RelPermalink }}" media="(min-width: 1200px)">
<style>
  #{{ $blockID }} {
      background-image: url({{ $promo_image_small.RelPermalink }});
  }
  
  @media only screen and (min-width: 1200px) {
      #{{ $blockID }} {
          background-image: url({{ $promo_image_big.RelPermalink }}); 
      }
  }
</style>
{{ end }}
<section id="{{ $blockID }}" class="row td-hero-block">
  <div class="container">
      <div class="row">
        <div class="col-md">
            {{ with .Get "title" }}<h1 class="display-1">{{ $title := . }}{{ with $logo_image }}{{ $logo_image_resized := (.Fit (printf "70x70 %s" $logo_anchor)) }}<img class="td-hero-logo" src="{{ $logo_image_resized.RelPermalink }}" alt="{{ $title | html }} Logo">{{ end }}{{ $title | html }}</h1>{{ end }}
            {{ with .Get "subtitle" }}<p>{{ . | html }}</p>{{ end }}

            {{ if eq .Page.File.Ext "md" }}
              {{ .Inner | markdownify }}
            {{ else }}
              {{ .Inner | htmlUnescape | safeHTML }}
            {{ end }}

            {{ if ne $link_url "#" }}
            <a class="btn btn-lg btn-info" href="{{ $link_url }}">{{ $link_title }}</a>
            {{ end }}
        </div>

        <div class="col-md is-half is-hidden-touch col-terminal">
          <div class="terminal">
            <div class="icons"><span></span></div>
            <div class="terminal-title">Terminal</div>
            <pre class="terminal-content">
              <asciinema-player loop autoplay font-size="14px" rows=14 src="flux.cast"></asciinema-player>
            </pre>
          </div>
        </div>

      </div>
  </div>
</section>
