{{ define "main" }}

  <div id="page-header">
    <h1>{{ .Title }}</h1>
    {{ if .Params.subtitle }}
      <span class="subtitle">{{ .Params.subtitle }}</span>
    {{ end }}
  </div>

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

  {{ $pages := shuffle (where site.RegularPages "Section" "tools") | first 20 }}
  <section>
    <h2>Try Something New</h2>
    <p>This list shows a selection of 20 random tools, refreshed every time this site is updated.</p>
    <div id="tool-cards">
    {{ range $pages }}
      <article class="tool-card">
        <h3>
          {{ .Title }}
          {{ if .Params.subtitle }}
            <span class="subtitle">{{ .Params.subtitle }}</span>
          {{ end }}
        </h3>
        <p>{{ .Content | plainify | truncate 100 }}</p>
        <a href="{{ .RelPermalink }}" style="position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;text-indent:-9999px;overflow:hidden;">{{ .Title }}</a>
      </article>
    {{ end }}
    </div>
  </section>

    <div class="time" style="display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;">
    <div class="footer-links" style="text-align: left;">
      Help improve this page!<br/>
      Submit an 
      <a href="https://gitmoss.fyi/fmtools/content/issues/new?template=.gitea%2fissue_template%2ffix_tool.md&title=[FIX]%20{{ .Title | urlquery }}" target="_blank">issue</a> or 
      <a href="https://gitmoss.fyi/fmtools/content/fork" target="_blank">pull request</a>.
    </div>
    {{ if now }}
    <div class="footer-date" style="text-align: right;">
      {{ $dateMachine := now | time.Format "2006-01-02T15:04:05-07:00" }}
      {{ $dateHuman := now | time.Format "2 January 2006" }}
      Made with &#9829; using <a href="https://gohugo.io" target="_blank">Hugo</a> <br/>
      Built <time datetime="{{ $dateMachine }}">{{ $dateHuman }}</time>
    </div>
    {{ end }}
  </div>

{{ end }}