github.com/muhammadn/cortex@v1.9.1-0.20220510110439-46bb7000d03d/website/layouts/shortcodes/blocks/cover.html (about) 1 {{ $_hugo_config := `{ "version": 1 }` }} 2 {{ $blockID := printf "td-cover-block-%d" .Ordinal }} 3 {{ $promo_image := (.Page.Resources.ByType "image").GetMatch "**background*" }} 4 {{ $logo_image := (.Page.Resources.ByType "image").GetMatch "**logo*" }} 5 {{ $col_id := .Get "color" | default "dark" }} 6 {{ $image_anchor := .Get "image_anchor" | default "smart" }} 7 {{ $logo_anchor := .Get "logo_anchor" | default "smart" }} 8 {{/* Height can be one of: auto, min, med, max, full. */}} 9 {{ $height := .Get "height" | default "max" }} 10 {{ with $promo_image }} 11 {{ $promo_image_big := (.Fill (printf "1920x1080 %s" $image_anchor)) }} 12 {{ $promo_image_small := (.Fill (printf "960x540 %s" $image_anchor)) }} 13 <link rel="preload" as="image" href="{{ $promo_image_small.RelPermalink }}" media="(max-width: 1200px)"> 14 <link rel="preload" as="image" href="{{ $promo_image_big.RelPermalink }}" media="(min-width: 1200px)"> 15 <style> 16 #{{ $blockID }} { 17 background-image: url({{ $promo_image_small.RelPermalink }}); 18 } 19 @media only screen and (min-width: 1200px) { 20 #{{ $blockID }} { 21 background-image: url({{ $promo_image_big.RelPermalink }}); 22 } 23 } 24 </style> 25 {{ end }} 26 <section id="{{ $blockID }}" class="row td-cover-block td-cover-block--height-{{ $height }} js-td-cover td-overlay -bg-{{ $col_id }}"> 27 <div class="container td-overlay__inner my-auto"> 28 <div class="row"> 29 <div class="mx-auto"> 30 <img src="/images/cortex-horizontal.svg" width="300" class="img-fluid"> 31 </div> 32 </div> 33 <div class="row"> 34 <div class="col-12"> 35 <div class="text-center"> 36 {{ with .Get "title" }}<h1 class="display-1 mt-0 mt-5 pb-4">{{ $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 }} 37 {{ with .Get "subtitle" }}<p class="display-2 text-uppercase mb-0">{{ . | html }}</p>{{ end }} 38 <div class="pt-3 lead"> 39 {{ .Inner | markdownify}} 40 </div> 41 </div> 42 </div> 43 </div> 44 </div> 45 </section>