{% block header %}

    <div class="topbar">
        <div class="d-flex row justify-content-md-center text-center">

            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-235" name="notes[]" value="235" />
                <label for="notes-235" onclick="refreshList(this, $('#notes-235').prop('checked'), 'notes', '235')">
                    <img src="{{ asset("images/filtres/notes/ING039.jpg") }}" width="80px">
                    <p>Agrumes</p>
                </label>
            </div>
            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-236" name="notes[]" value="236" />
                <label for="notes-236" onclick="refreshList(this, $('#notes-236').prop('checked'), 'notes', '236')">
                    <img src="{{ asset("images/filtres/notes/ING045.jpg") }}" width="80px">
                    <p>Epicé</p>
                </label>
            </div>
            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-237" name="notes[]" value="237" />
                <label for="notes-237" onclick="refreshList(this, $('#notes-237').prop('checked'), 'notes', '237')">
                    <img src="{{ asset("images/filtres/notes/ING025.jpg") }}" width="80px">
                    <p>Floral</p>
                </label>
            </div>
            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-238" name="notes[]" value="238" />
                <label for="notes-238" onclick="refreshList(this, $('#notes-238').prop('checked'), 'notes', '238')">
                    <img src="{{ asset("images/filtres/notes/ING075.jpg") }}" width="80px">
                    <p>Fruité</p>
                </label>
            </div>
            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-239" name="notes[]" value="239" />
                <label for="notes-239" onclick="refreshList(this, $('#notes-239').prop('checked'), 'notes', '239')">
                    <img src="{{ asset("images/filtres/notes/ING008.jpg") }}" width="80px">
                    <p>Dessert</p>
                </label>
            </div>
            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-240" name="notes[]" value="240" />
                <label for="notes-240" onclick="refreshList(this, $('#notes-240').prop('checked'), 'notes', '240')">
                    <img src="{{ asset("images/filtres/notes/ING065.jpg") }}" width="80px">
                    <p>Boisé</p>
                </label>
            </div>
            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-241" name="notes[]" value="241" />
                <label for="notes-241" onclick="refreshList(this, $('#notes-241').prop('checked'), 'notes', '241')">
                    <img src="{{ asset("images/filtres/notes/ING050.jpg") }}" width="80px">
                    <p>Végétal</p>
                </label>
            </div>
{#            <div class="p-2 float-left">#}
{#                <input class="d-none" type="checkbox" id="notes-242" name="notes[]" value="242" />#}
{#                <label for="notes-242" onclick="refreshList(this, $('#notes-242').prop('checked'), 'notes', '242')">#}
{#                    <img src="{{ asset("images/filtres/notes/ING007.jpg") }}" width="80px">#}
{#                    <p>Fumé 242</p>#}
{#                </label>#}
{#            </div>#}
            <div class="p-2 float-left">
                <input class="d-none" type="checkbox" id="notes-248" name="notes[]" value="248" />
                <label for="notes-248" onclick="refreshList(this, $('#notes-248').prop('checked'), 'notes', '248')">
                    <img src="{{ asset("images/filtres/notes/ING083.jpg") }}" width="80px">
                    <p>Nature</p>
                </label>
            </div>
        </div>
    </div>

{% endblock %}