<div class="row w-100">
  {% for entry in entries %}
  <div class="col-md-4 d-flex justify-content-center mb-5">

    <div class="custom-thumbnail img-thumbnail position-relative" style="width: 250px; height: 250px;"
      thumbid={{entry.id}}>

      <input type="checkbox" name="checkbox" class="thumbCheckbox position-absolute custom-backend-checkbox">
      <div class="dropdown position-absolute top-0 end-0" style="z-index: 10;">
        <button class="btn btn-secondary" type="button" data-bs-toggle="dropdown" aria-expanded="false">
          &#8285;
        </button>
        <ul class="dropdown-menu dropdown-menu-end">
          {% if status == "deleted" %}
          <li><button class="dropdown-item text-danger" href="#">endgültig löschen</button></li>
          <li><a class="dropdown-item" href="#">herunterladen</a></li>
          {% else %}
          <li><a class="dropdown-item" href="#">Bearbeiten</a></li>
          <li><a class="dropdown-item" href="/backend/download/original/{{entry.id}}">Herunterladen</a></li>
          <li><a class="dropdown-item" href="" onclick="deletePost({{entry.id}}, this)">Löschen</a></li>
          {% endif %}
        </ul>
      </div>
      <div class="custom-backend-layer"></div>
      {% set ImageFile = "/upload/"~entry.ImageFile %}
      <img src="{{ImageFile}}" class="" alt="..." id="{{entry.id}}">
    </div>
  </div>
  {% endfor %}

</div>
<div id="counter" class="d-none">
  <p class="h2">{{counts.countStatus}}</p>
  <p class="">{{counts.name}} Bilder</p>
  <p class="opacity-75">von insgesamt {{counts.countAllEntries}}</p>
</div>
</div>