{{ define "main" }}
<div class="container">
  <div class="columns mt-5 is-variable is-mobile is-8">
    <!--
  If the current page is a blog post and belongs to a case, we will add a side menu
  with all other blog posts belonging to that case, emphasis to the current.
  -->
    {{ if (and .IsPage (eq .FirstSection.Section "posts"))}}
    {{ with .CurrentSection }}
    <aside class="menu column is-3 mt-2 is-align-self-flex-start">
      <p class="menu-label">
        Dans le dossier « <a href="{{ .Permalink }}">{{ .Params.Title }} »</a>...
      </p>
      <div class="menu-list">
        {{ $posts := (where $.Site.RegularPages "CurrentSection.Params.Code" "==" $.CurrentSection.Params.Code )}}
        {{ $postsSorted := (sort $posts "Date" )}}
        {{ range $postsSorted }}
        <a {{ if eq $.Title .Title }} class="is-active" {{ end }} href="{{ .Permalink }}">{{ .Title }}</a>
        {{ end }}
      </div>
    </aside>
    {{ end }}
    {{ end }}
    <section class="column is-7">
      <div>
        <article>
          {{ with .Params.introduction }}
            {{ . }}
            <br /><br />
          {{ end }}
          <div class="message is-info">
            <div class="message-header">Sommaire</div>
            <!-- Appreciate this horrible trick, even a 2000's HTML generator won't generate such horrible code -->
            <div class="message-body pt-1">{{ .TableOfContents | replaceRE "<a" "<a style='text-decoration:none;'" | safeHTML }}</div>
          </div>
          {{ .Content }}
        </article>
      </div>
      <aside class="container level my-5">
        <div class="level-left">
          {{ with .PrevInSection }}
          <div class="level-item">
            <a class="button is-info" href="{{ .Permalink }}">&laquo;&nbsp;{{ .Title }}</a>
          </div>
          {{ end }}
        </div>
        <div class="level-right">
          {{ with .NextInSection }}
          <div class="level-item">
            <a class="button is-info" href="{{ .Permalink }}">{{ .Title }}&nbsp;&raquo;</a>
          </div>
          {{ end }}
        </div>
      </aside>
    </section>
  </div>
</div>
{{ end }}