{% block blitz_crud_table_template %}
<div class="table-responsive">
    {% block blitz_crud_table %}
    <table class="{% block blitz_crud_table_class %}table table-hover blitzTable{% endblock blitz_crud_table_class %}">
        {% if context.show_caption %}{% block blitz_crud_table_caption %}<caption>{% if context.title_as_caption %}{{context.title}}{% else %}{{context.caption}}{% endif %}</caption>{% endblock blitz_crud_table_caption %}{% endif %}
        <thead>
            {% block blitz_crud_table_headers %}    
            <tr>
            {% block blitz_crud_table_select_all %}
            <th scope="col-auto">
                <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input blitzCheckAll" id="blitzTableSelectAllButton">
                    <label class="custom-control-label" for="blitzTableSelectAllButton"><span class="str-only"></span></label>
                </div>
            </th>
            {% endblock blitz_crud_table_select_all %}
            {% block blitz_crud_table_headers_populate %}
            {% for header in context.headers %}
                {% block blitz_crud_table_header %}<th scope="col"><a href="?table={{context.caption}}&order={{header.direction}}{{header.column}}{{context.search}}">{{header.text}}<span><i class="{% block blitz_crud_table_header_class %}fa fa-caret-{% if header.direction %}down{%else%}up{%endif%}{% endblock blitz_crud_table_header_class %}" ></i></span></a></th>{% endblock blitz_crud_table_header %}
            {% endfor %}
            {% endblock blitz_crud_table_headers_populate %}
            </tr>
            {% endblock blitz_crud_table_headers %}
        </thead>
        <tbody>
            {% block blitz_crud_table_body%}
            {% for row in context.values %}
                {% block blitz_crud_table_body_row %}
                <tr class="{% block blitz_crud_table_row_class %}blitzTr{% endblock blitz_crud_table_row_class %}">
                    <input type="hidden" value="{{row.pk}}" name="pk-{{forloop.counter0}}" id="pk-{{forloop.counter0}}">
                    {% block blitz_crud_table_row_select %}
                    <th scope="row">
                        <div class="custom-control custom-checkbox">
                            <input type="checkbox" class="custom-control-input blitzCheck" id="blitz-select-{{forloop.counter0}}">
                            <label class="custom-control-label" for="blitz-select-{{forloop.counter0}}"><span class="str-only"></span></label>
                        </div>
                    </th>
                    {% endblock blitz_crud_table_row_select %}
                    {% block blitz_crud_table_row_values_populate %}
                    {% for value in row.values %}
                        {% block blitz_crud_table_row_value %}
                        <td>{{value}}</td>
                        {% endblock blitz_crud_table_row_value %}
                    {% endfor %}
                    {% endblock blitz_crud_table_row_values_populate %}
                </tr>
                {% endblock blitz_crud_table_body_row %}
            {% endfor %}
            {% endblock blitz_crud_table_body %}
        </tbody>
    </table>{% endblock blitz_crud_table %}{% endblock blitz_crud_table_template %}{% block blitz_crud_pagination %}
</div>
<nav>
    <ul class="pagination justify-content-end">
        <li class="page-item {% if context.page.has_previous is False %}disabled{% endif %}">
            <a class="page-link" href="?table={{context.caption}}&order={{context.current_order}}&page={% if context.page.has_previous %}{{ context.page.previous_page_number }}{% else %}{{context.page.number}}{% endif %}{{context.search}}">&laquo;</a>
        </li>
        <li class="page-item">
            <div class="dropdown">
                <button class="page-link dropdown-toggle" type="button" id="blitzPaginationDropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {{context.page.number}}
                </button>
                <div class="dropdown-menu" aria-labelledby="blitzPaginationDropdownMenuButton">
                    {% for page in context.page.paginator.page_range %}
                    <a class="dropdown-item {% if page == context.page.number %}active{% endif %}" href="?table={{context.caption}}&order={{context.current_order}}&page={{ page }}{{context.search}}">{{ page }}</a>
                    {% endfor %}
                </div>
            </div>
        </li>
        <li class="page-item disabled"><a class="page-link" >of</a></li>
        <li class="page-item"><a class="page-link" href="?table={{context.caption}}&order={{context.current_order}}&page={{ context.page.paginator.num_pages }}{{context.search}}">{{ context.page.paginator.num_pages }}</a></li>
        <li class="page-item {% if context.page.has_next is False %}disabled{% endif %}">
        <a class="page-link" href="?table={{context.caption}}&order={{context.current_order}}&page={% if context.page.has_next %}{{ context.page.next_page_number }}{% else %}{{context.page.number}}{% endif %}{{context.search}}">&raquo;</a>
        </li>
    </ul>
</nav>
{% endblock blitz_crud_pagination %}