<div class="table-responsive">
    <table class="table table-striped">
        <thead class="thead-inverse">
            <tr>
                <th>IconName</th>
                <th>Small</th>
                <th>Default</th>
                <th>Large</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            {% for icon in folder.icons %}
            <tr>
                <td>{{ icon.file|replace({'.svg': ''}) }}</td>
                <td><img src="images/{{ folder.folder }}/{{ icon.file }}" height="16" width="16"></td>
                <td><img src="images/{{ folder.folder }}/{{ icon.file }}" height="32" width="32"></td>
                <td><img src="images/{{ folder.folder }}/{{ icon.file }}" height="64" width="64"></td>
                <td><a class="btn btn-sm btn-secondary-outline" href="images/{{ folder.folder }}/{{ icon.file }}">File</a></td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
