<div class="columns is-multiline">
  {{- range .Entries }}
  <div class="column is-4-mobile is-3-tablet">
    <div class="card"
         hx-get="{{ if .IsDir }}/folders?path={{ urlquery .Path }}{{ else }}/folders/detail?path={{ urlquery .Path }}{{ end }}"
         hx-target="{{ if .IsDir }}#content{{ else }}#content{{ end }}"
         hx-push-url="true"
         style="cursor:pointer">
      <div class="card-image">
        <figure class="image is-4by3">
          {{ if .IsDir }}
            <i class="fas fa-folder fa-3x has-text-warning" style="margin:1rem"></i>
          {{ else if or (hasSuffix .Name ".jpg") (hasSuffix .Name ".png") }}
            <img src="/app/upload/{{ .Path }}" alt="{{ .Name }}">
          {{ else }}
            <i class="fas fa-file fa-3x"></i>
          {{ end }}
        </figure>
      </div>
      <div class="card-content">
        <p class="title is-6">{{ .Name }}</p>
      </div>
    </div>
  </div>
  {{- end }}
</div>
