{{ $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" }} {{ 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-cover-block td-cover-block--height-{{ $height }} js-td-cover td-overlay td-overlay--dark -bg-{{ $col_id }}"> <div class="container td-overlay__inner"> <div class="row"> <div class="cover-content col-12"> <nav class="navbar navbar-expand navbar-dark flex-column flex-md-row"> <div class="td-navbar-nav-scroll ml-md-auto" id="cover_navbar"> <ul class="navbar-nav mt-2 mt-lg-0"> {{ $p := . }} {{ range .Site.Menus.main }} <li class="nav-item mr-4 mb-2 mb-lg-0"> <a class="nav-link" href="{{ with .Page }}{{ .RelPermalink }}{{ else }}{{ .URL | relLangURL }}{{ end }}"><span>{{ .Name }}</span></a> </li> {{ end }} {{ if (gt (len .Site.Home.Translations) 0) }} <li class="nav-item dropdown d-none d-lg-block"> {{ partial "navbar-lang-selector.html" . }} </li> {{ end }} </ul> </div> <div class="navbar-nav d-none d-lg-block">{{ partial "search-input.html" . }}</div> </nav> {{ with .Get "title" }}<h1 class="display-1 mt-0 mt-md-5">{{ $title := . }}{{ with $logo_image }}{{ $logo_image_resized := (.Fit (printf "70x70 %s" $logo_anchor)) }}<img class="td-cover-logo" src="{{ $logo_image_resized.RelPermalink }}" alt="{{ $title | html }} Logo">{{ end }}{{ $title | html }}</h1>{{ end }} {{ with .Get "subtitle" }}<p class="display-2 text-uppercase mb-0">{{ . | html }}</p>{{ end }} <div class="pt-3 lead"> {{ .Inner }} </div> </div> </div> </div> </section>