{{ define "document.gohtml" }}{{ template "base" . }}{{ end }}

{{ define "document_content" }}
<section class="workspace-shell workspace-shell--document">
  {{ template "browser" .Browser }}
  <article class="document-shell" data-document-path="{{ .Path }}" data-document-hash="{{ .Hash }}">
    <nav class="breadcrumbs" aria-label="Breadcrumb">
      <ol>
        {{ $lastIdx := sub (len .Breadcrumbs) 1 }}
        {{ range $i, $crumb := .Breadcrumbs }}
          <li>
            {{ if eq $i $lastIdx }}
              <span aria-current="page">{{ $crumb.Name }}</span>
            {{ else }}
              <a href="{{ $crumb.URL }}">{{ $crumb.Name }}</a>
            {{ end }}
          </li>
        {{ end }}
      </ol>
    </nav>
    <div class="document-meta">
      <h1>{{ .Title }}</h1>
      <dl class="meta-grid">
        <div>
          <dt>File</dt>
          <dd><code>{{ .Path }}</code></dd>
        </div>
        <div>
          <dt>Hash</dt>
          <dd><code>{{ .Hash }}</code></dd>
        </div>
        {{ if .Tags }}
          <div>
            <dt>Tags</dt>
            <dd>
              <ul class="tag-list">
                {{ range .Tags }}
                  <li><a href="/?tag={{ . }}">#{{ . }}</a></li>
                {{ end }}
              </ul>
            </dd>
          </div>
        {{ end }}
      </dl>
    </div>

    <div class="markdown-body">
      {{ .HTML }}
    </div>
  </article>
</section>
{{ end }}

{{ define "browser" }}
<nav class="miller-browser" aria-label="Documents">
  {{ range .Columns }}
    <section class="miller-column {{ if eq .Title "Content" }}miller-column--root{{ end }}" aria-label="{{ .Title }}">
      <h2 title="{{ .Title }}">
        {{ if eq .Title "Content" }}
          <span class="browser-icon browser-icon--root" aria-hidden="true"></span>
        {{ end }}
        <span class="miller-column-title-text">{{ .Title }}</span>
      </h2>
      <ul>
        {{ range .Items }}
          <li>
            <a class="{{ if .Active }}is-active{{ end }} {{ if .IsFolder }}is-folder{{ end }}" href="{{ .URL }}" title="{{ .Name }}">
              <span class="browser-item-label">
                <span class="browser-icon {{ if .IsFolder }}browser-icon--folder{{ else }}browser-icon--page{{ end }}" aria-hidden="true"></span>
                <span class="browser-item-name">{{ .Name }}</span>
              </span>
              {{ if .IsFolder }}<span class="browser-item-chevron" aria-hidden="true">›</span>{{ end }}
            </a>
          </li>
        {{ end }}
      </ul>
    </section>
  {{ end }}
</nav>
{{ end }}