single.html

{{ define "body-class" }}
grey-background
{{ end }}

{{ define "og" }}
  <meta property="og:title" content="COMPOST Issue 01: {{ .Params.title }} by {{ .Params.author }}" />
  <meta property="og:url" content="https://one.compost.digital{{ .Page.RelPermalink }}" />
  <meta property="og:image" content="https://one.compost.digital{{ .Params.tableOfContentsImageUrl | relURL }}" />
  <meta property="og:description" content="{{ .Params.description }}" />
{{ end }}

{{ define "title" }}
COMPOST Issue 01: {{ .Params.title }} by {{ .Params.author }}
{{ end }}

{{ define "main" }}
  
  <div class="piece-container main-column {{ .Params.customClass }}">
    {{ $author := index (where .Site.Data.people "name" .Params.author) 0 }}

    {{ if isset .Params "titleimageurl" }}
      <div class="piece-title-image">
        <figure>
          <img src="{{ .Params.titleImageUrl | relURL }}" alt="{{ .Params.titleImageAlt }}">
          <figcaption><p>{{ .Params.titleImageCaption }}</p></figcaption>
        </figure>
      </div>
    {{ end }}

    <h1>{{.Params.title}}</h1>

    {{ if isset .Params "subtitle" }}
      <h2 class="piece-subtitle">{{ .Params.subtitle }}</h2>
    {{ end }}

    <div class="author-name">{{ $author.name }}</div>

    {{ .Content }}

    {{ if isset .Params "endingimageurl" }}
      <div class="gif-ending">
        <img src="{{ .Params.endingImageUrl | relURL }}" alt="{{ .Params.endingImageAlt }}">
      </div>
    {{ else }}
      <div class="gif-ending">
        <img src="{{ "./images/angelica-gifs/mantis_computer.gif" | relURL }}" alt="A cartoon praying mantis dancing in front of a laptop.">
      </div>
    {{ end }}
    
    <div class="bio"><p>{{ $author.bio | markdownify }}</p></div>

    {{ partial "prev-and-next-buttons.html" . }}

    <!-- Footnotes -->
    <div class="footnotes-container"></div>
    <!-- See baseof.html for mobile-footnotes-container -->

    {{ if isset .Params "footnotesurl" }}
      <script>
        var footnotes = JSON.parse({{ (.Resources.GetMatch .Params.footnotesUrl).Content }})
      </script>
    {{ end }}

    {{ if isset .Params "footnotes" }}
      <script>
        var footnotes = JSON.parse({{ .Params.footnotes | jsonify }})
      </script>
    {{ end }}
  </div>

{{ end }}

{{ define "scripts" }}
  <script src="{{ (resources.Get "js/footnotes.js").RelPermalink }}"></script>
{{ end }}