{% extends "base.html" %}

{% block title %}Bioregistry{% endblock %}

{% block styles %}
    {{ super() }}
    <!-- DataTables, see: https://datatables.net/examples/styling/bootstrap4.html-->
    <link
            rel="stylesheet"
            href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css"
    />
{% endblock %}

{% block scripts %}
    {{ super() }}
    <!-- DataTables, see: https://datatables.net/examples/styling/bootstrap4.html-->
    <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#table-entries").DataTable({
                "order": [[ 1, "asc" ]]
            });
            $("#table-entries_wrapper").children(":first-child").addClass("card-body");
            $("#table-entries_wrapper").children(":last-child").addClass("card-body");
        });
    </script>
{% endblock %}

{% block container %}
    <div class="card">
        <div class="card-header">
            <div class="row">
                <div class="col-8"><h5 style="margin: 0">Registry</h5></div>
                <div class="col-4 text-right">
                    <a href="{{ url_for("api.resources") }}">
                        JSON <i class="fas fa-download"></i>
                    </a>
                </div>
            </div>
        </div>
        <table id="table-entries" class="table table-striped table-hover ">
            <thead>
            <tr>
                <td>Name</td>
                <td>Prefix</td>
                <td>Description</td>
            </tr>
            </thead>
            {% for row in rows %}
                <tr>
                    <td><a href="{{ url_for('ui.resource', prefix=row.prefix) }}">{{ row.name }}</a></td>
                    <td class="text-nowrap"><code>{{ row.prefix }}</code></td>
                    <td>{% if row.description %}<small>{{ row.description }}</small>{% endif %}</td>
                </tr>
            {% endfor %}
        </table>
    </div>
{% endblock %}













