{{ define "main" }}

<div class="home">

  {{- $parents := .Params.Topics -}}
  {{- $mainWidth := or (and $parents "8") "12" -}}
  {{- $children := (where 
                      (where .Site.Pages "Section" "topics") 
                   "Params.topics" "intersect" (slice .Name))  -}}
  <div class="row">
    <div class="col-md-{{ $mainWidth }}">
      <div class="card mt-3 mb-3">
        <div class="card-header">
          <h2 class="card-text">{{i18n .Data.Singular}}: {{ .Title }}</h2>
        </div>
        <div class="card-body">
          {{ with .Content -}}
            <div class="card-text">{{ . }}</div>
          {{- end }}
          {{ with $children -}}
            <p class="card-text">
            {{- i18n "child-topics" -}}:
            {{ range . -}}
              <span class="badge rounded-pill bg-secondary m-1">
                <a href="{{ .Permalink }}">{{ .Title }}</a>
              </span>
            {{- end }}
            </p>
          {{- end }}
        </div>
      </div>
    </div>
    {{ partial "parent-topics.html" . }}
  </div>

  <div class="row">
    {{ $paginator := .Paginate (.Data.Pages) }}
    {{ range $paginator.Pages }}
      {{ partial "card.html" . }}
    {{ end }}
  </div> 
    
  <div class="row">
    {{ partial "pagination.html" . }}
  </div>

</div>
{{ end }}