{% extends "idhub/base.html" %}
{% load i18n %}

{% block content %}
<h3>
  <i class="{{ icon }}"></i>
  {{ subtitle }}
</h3>
<div class="row mt-5">
  <div class="col">
    <div class="table-responsive">
      <table class="table table-striped table-sm">
        <thead>
          <tr>
            <th scope="col"><button type="button" class="btn btn-grey border border-dark">{% trans 'Type' %}</button></th>
            <th scope="col"><button type="button" class="btn btn-grey border border-dark">{% trans 'Details' %}</button></th>
            <th scope="col"><button type="button" class="btn btn-grey border border-dark">{% trans 'Issued' %}</button></th>
            <th scope="col" class="text-center"><button type="button" class="btn btn-grey border border-dark">{% trans 'Status' %}</button></th>
            <th scope="col"></th>
          </tr>
        </thead>
        <tbody>
          {% for f in credentials.all %}
          <tr style="font-size:15px;">
            <td>{{ f.type }}</td>
            <td>{{ f.description }}</td>
            <td>{{ f.get_issued_on }}</td>
            <td class="text-center">{{ f.get_status }}</td>
            <td>
              <a href="{% url 'idhub:user_credential' f.id %}" class="text-primary" title="{% trans 'View' %}"><i class="bi bi-eye"></i></a>
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
</div>
{% endblock %}
