<nav class="navbar navbar-expand-lg navbar-transparent navbar-absolute fixed-top ">
    <div class="container-fluid">
        <div class="navbar-wrapper">
            <a class="navbar-brand" href="javascript:;">{{ log_name }}</a>
        </div>
    </div>
</nav>
<!-- End Navbar -->
<div class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12 col-md-12">
                <div class="card">
                    <div class="card-header">
                        <div class="row">
                            <div class="col-lg-9 col-9">
                                <h6>{{ log_name }}</h6>
{#                                <div class="form-group">#}
{#                                    <input type="text" class="form-control col-md-6" name="date_range" id="date-range">#}
{#                                </div>#}
                            </div>
                            <div class="col-lg-3 col-3">
                                <form action="" id="change-log-form">
                                    <input type="hidden" name="name" value="{{ log_name }}">
                                    <select name="child" id="log-select" class="form-control" onchange="switchLog();">
                                        {% for file_name in files %}
                                            {% if child and child == file_name %}
                                                <option value="{{ file_name }}" selected>{{ file_name }}</option>
                                            {% else %}
                                                <option value="{{ file_name }}">{{ file_name }}</option>
                                            {% endif %}
                                        {% endfor %}
                                    </select>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table align-items-center mb-0 datatable table-striped log-table">
                                <thead>
                                <tr>
                                    {% if columns %}
                                        <th>S/N</th>
                                        {% for column in columns %}
                                            <th>{{ column }}</th>
                                        {% endfor %}
                                    {% endif %}
                                </tr>
                                </thead>
                                <tbody>
                                {% for columns in rows %}
                                    <tr>
                                        <td>{{ forloop.counter }}</td>
                                        {% for column in columns %}
                                            <td>{{ column }}</td>
                                        {% endfor %}
                                    </tr>
                                {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>