hugo-paper/layouts/_default/single.html

{{ define "main" }}

<article>
  <header class="mb-20">
    <h1 class="!my-0 pb-2.5">{{ .Title }}</h1>

    {{ if ne .Type "page" }}
    <div class="text-sm opacity-60">
      {{ if .Date }}
      <time>{{ .Date | time.Format ":date_medium" }}</time>
      {{ end }}<!---->
      {{ if or .Params.Author site.Author.name }}
      <span class="mx-1">&middot;</span>
      <span>{{ .Params.Author | default site.Author.name }}</span>
      {{ end }}
    </div>
    {{ end }}
  </header>

  <section>{{ .Content }}</section>

  <!-- Post Tags -->
  {{ if .Params.tags }}
  <footer class="mt-12 flex flex-wrap">
    {{ range .Params.tags }} {{ $href := print (absURL "tags/") (urlize .) }}
    <a
      class="mr-1.5 mb-1.5 rounded-lg bg-black/[3%] px-5 py-2 no-underline dark:bg-white/[8%]"
      href="{{ $href }}"
      >{{ . }}</a
    >
    {{ end }}
  </footer>
  {{ end }}

  <!-- Post Nav -->
  {{ $pages := where site.RegularPages "Type" "in" site.Params.mainSections }}<!---->
  {{ if and (gt (len $pages) 1) (in $pages . ) }}
  <nav
    class="mt-24 flex rounded-lg bg-black/[3%] p-1.5 text-lg dark:bg-white/[8%]"
  >
    {{ with $pages.Next . }}
    <a
      class="flex w-1/2 items-center rounded-md p-6 pr-3 no-underline hover:bg-black/[2%]"
      href="{{ .Permalink }}"
      ><span class="mr-1.5">←</span><span>{{ .Name }}</span></a
    >
    {{ end }}<!---->
    {{ with $pages.Prev . }}
    <a
      class="ml-auto flex w-1/2 items-center justify-end rounded-md p-6 pl-3 no-underline hover:bg-black/[2%]"
      href="{{ .Permalink }}"
      ><span>{{ .Name }}</span><span class="ml-1.5">→</span></a
    >
    {{ end }}
  </nav>
  {{ end }}

  <!-- Disqus -->
  {{ if and site.DisqusShortname (not (eq .Params.comments false)) }}
  <div class="mt-24" id="disqus_thread"></div>
  <script>
    const disqusShortname = '{{ site.DisqusShortname }}';
    const script = document.createElement('script');
    script.src = 'https://' + disqusShortname + '.disqus.com/embed.js';
    script.setAttribute('data-timestamp', +new Date());
    document.head.appendChild(script);
  </script>
  {{ end }}
</article>

{{ end }}