{% partialdef projects-filter %}
  {% include "lara_django_projects/components/projects_filter.html" %}
{% endpartialdef projects-filter %}
{% partialdef projects-list %}
  {% include "lara_django_projects/components/projects_list.html" %}
{% endpartialdef projects-list %}
{% partialdef project-experiment-card %}
  {% include "lara_django_projects/components/project_experiment_card.html" %}
{% endpartialdef project-experiment-card %}


<div id="project-list-container" class="grid grid-cols-4 gap-4">
    <section id="project-list" class="col-span-4 lg:col-span-3">
        {% for item in page_obj %}
            {% with item_id=item.project_id %}
                {% with item_url="lara_django_projects:project-detail" %}
                    {% with level=item.get_level %}
                        <!--div class="{% if level == 1 %}col-span-4 bg-green-200 {% elif level == 2 %}col-span-3 bg-red-200{% elif level == 3 %}col-span-2{% else %}col-span-1{% endif %}"-->
                            {% partial project-experiment-card %}
                        <!--/div-->
                    {% endwith %}
                {% endwith %}
            {% endwith %}
        {% endfor %}
    {% include "lara_django_projects/components/pagination.html" %}
    </section>
    <section id="filters" class="hidden lg:grid col-span-1 mb-4">
        {% partial projects-filter %}
    </section>

</div>