{% load i18n %}

<div id="tab-fats" class="tab-pane fade show active card card-default border-0" role="tabpanel" aria-labelledby="tab-fats">
    <div class="card-body clearfix">
        <div class="row">
            <div class="col-md-8">
                {% if link_ongoing %}
                    {% translate "FATs for this FAT link <small>(updated every 15 seconds)</small>" as header %}
                {% else %}
                    {% translate "FATs for this FAT link" as header %}
                {% endif %}

                <h4>{{ header }}</h4>

                <table class="table table-striped table-hover w-100" id="fleet-edit-fat-list">
                    <thead>
                        <tr>
                            <th>{% translate "Character" %}</th>
                            <th>{% translate "Location" %}</th>
                            <th>{% translate "Ship type" %}</th>
                            <th><!-- {% translate "Actions" %} --></th>
                        </tr>
                    </thead>

                    <tbody>
                        <tr>
                            <td colspan="4" class="text-center">
                                {% include "afat/partials/common/spinner.html" %}
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>

            <div class="col-md-4">
                <h4>
                    {% translate "Ship type overview" %}
                </h4>

                <table class="table table-striped table-hover w-100" id="fleet-edit-ship-types">
                    <thead>
                        <tr>
                            <th>
                                {% translate "Ship type" %}
                            </th>
                            <th class="text-end">{% translate "Count" %}</th>
                        </tr>
                    </thead>

                    <tbody>
                        <tr>
                            <td colspan="2" class="text-center">
                                {% include "afat/partials/common/spinner.html" %}
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>