blog/themes/chosto/layouts/partials/header.html

<!-- Allow to skip heading, for example in an about page -->
{{ if not .Params.noheader }}
<!-- Display background only for regular pages, or home -->
{{ $background := in "page home" .Kind }}
<header>
  <section class='hero has-text-centered {{ if $background }}is-large is-info has-bg-img{{ end }}'>
    <div class="blur">
      <div class="hero-head mx-5">
        <div class="level mt-4">
          <div class="level-left">
            {{ with .Params.imgLicence }}
            <p class="level-item subtitle is-size-5-desktop is-size-7-mobile">
              Image d'illustration {{ . }}
            </p>
            {{ end }}
          </div>
          <div class="level-right mt-3 is-hidden-touch">
            <div class="level-item">
              {{ with .Params.categories }}
              <div class="tags colums is-vcentered">
                {{ range . }}
                <span class="tag is-info is-light is-large mr-4"><a href="{{ " categories" | absURL }}/{{ . | urlize
                    }}">{{ . }}</a></span>
                {{ end }}
              </div>
              {{ end }}
            </div>
          </div>
        </div>

      </div>
      <div class="hero-body {{ if not $background }}pb-0{{ end }} container has-text-centered">
        <p class="title is-size-1-desktop is-size-3-mobile is-uppercase">{{ .Title }}</p>
        {{ with .Params.subtitle }}
        <p class="mt-5 subtitle is-size-2-desktop is-size-5-mobile">{{ . }}</p>
        {{ end }}
      </div>
      <!-- Words and date stuff makes sens only for blog posts, not other pages -->
      {{ if (and .IsPage (eq .FirstSection.Section "posts"))}}
      <div class="hero-foot mb-5 mx-5 content">
        <div class="level">
          <div class="level-left">
            <div class="level-item has-text-left">
              <time datetime="{{ .Date.Format `2006-01-02T15:04:05Z07:00` | safeHTML }}">
                <p class="mb-2 subtitle is-size-5-desktop is-size-7-mobile">📅&nbsp;&nbsp;Article publié le <strong>{{ .Date.Day }} {{ index $.Site.Data.months_fr
                    (printf "%d" .Date.Month) }} {{ .Date.Year }}</strong></p>
                <p class="subtitle is-size-5-desktop is-size-7-mobile">✏️&nbsp;&nbsp;Dernière modification le <strong>{{ .Lastmod.Day }} {{ index $.Site.Data.months_fr
                    (printf "%d" .Lastmod.Month) }} {{ .Lastmod.Year }}</strong></p>
              </time>
            </div>
          </div>
          <div class="level-right is-hidden-touch">
            <div class="level-item has-text-right">
              <div>
                <p class="mb-2 subtitle is-size-5-desktop is-size-7-mobile">🕑&nbsp;&nbsp;Environ <strong>{{ div .FuzzyWordCount 230 }} minutes</strong> de lecture
                </p>
                <p  class="subtitle is-size-5-desktop is-size-7-mobile">#️&nbsp;<strong>{{ .FuzzyWordCount }} mots</strong></p>
              </div>
            </div>
          </div>
        </div>
      </div>
      {{ end }}
    </div>
  </section>
</header>
{{ end }}