{# display the list of list #}

{% set category_menu = [('list_item_new', url_list_new)] %}
{% extends 'base/base.html' %}
{% import 'input/xmlui.html' as xmlui with context %}
{% import 'input/navigation.html' as navigation with context %}
{% import 'input/textbox.html' as textbox with context %}

{% block body %}
<section class="section has-background-white">
    <nav class="level mb-4">
        <div class="level-left">
            <div class="level-item">
                {{ component.action_button(url_list_new) }}
            </div>
        </div>
        <div class="level-right">
            <div class="level-item">
                {{ textbox.search() }}
            </div>
        </div>
    </nav>
    <div id="list" class="container has-background-white px-1 py-1">
        {{ xmlui.generate_list(
              list_items,
              (
                  ('title', _('Title')),
                  ('labels', _('Labels')),
                  ('id', _('Id')),
                  ('author', _('Author')),
              ),
              {
                  'id': '\n#{value}',
                  'author': _('by {value}'),
              },
               item_class_fields=['status', 'priority', 'severity'],
               field_class_map={
                   'title': 'has-text-weight-bold',
                   'labels': 'tag is-rounded x-is-hoverable',
                   'id': 'has-text-grey-light is-size-7 has-whitespace-pre-wrap',
                   'author': 'is-size-7'
               },
               on_click=on_list_item_click)
        }}
    </div>
</section>
{{ navigation.prev_next(_("previous page"), _("next page")) }}
{% endblock body %}