<!DOCTYPE html>
<html class="theme--default text-lg sm:text-xl font-light print:text-base">
  <meta charset="UTF-8" />
  <head>
    <title>{{.Title}}</title>

    {{template "head_common" .HeadCommonPartial}}
  </head>

  <body class="mb-16 print:text-black text-gray-600 dark:text-neutral-50 bg-white dark:bg-neutral-800">
    {{template "top" .}}

    <div
      class="block sm:flex sm:justify-center sm:items-center mx-auto px-4 sm:px-0"
    >
      <div
        class="flex w-full sm:w-9/12 px-4 justify-between overflow-visible gap-10 lg:gap-48vw max-w-screen-2xl print:w-full"
      >
        <div class="flex items-center sm:items-start relative sm:sticky self-start basis-1/4 sm:mt-8 top-auto sm:top-8">
          <div class="text-2xl">{{.Title}}</div>
        </div>

        <div class="break-words w-full sm:w-1/2 print:w-full break-all">
          <div class="leading-5 mb-6">
            <h1 class="text-xl">{{.Title}}</h1>
          </div>

          <div class="leading-5 mb-6">
            {{range $element := .Data }}
            <a href="/{{$.PathPrefix}}{{$element}}">
              <div>{{$element}}</div>
            </a>
            {{end}}
          </div>

          <div class="flex justify-between">
          {{if not (eq .PrevPage 0)}}
          <a href="/{{.PaginationUrl}}/{{.PrevPage}}"
            ><< Prev page</a
          >
          {{end}} {{if not (eq .NextPage 0)}}
          <a href="/{{.PaginationUrl}}/{{.NextPage}}"
            >Next page >></a
          >
          {{end}}
        </div>
      </div>
    </div>

    {{template "footer" .}}
  </body>
</html>
