{% extends 'lara_django_base/lara_base.html' %}

{% block content %}

<div class="relative overflow-x-auto">

    {% include 'lara_django_projects/components/project_table.html' %}

</div>

{% endblock content %}

{% block scripts %}

<script>
    let btn = document.getElementById('show-filter-btn');
    btn.addEventListener('click', (e) => {
      let filterSection = document.getElementById('filters');
      if (filterSection.classList.contains('hidden')) {
        filterSection.classList.remove('hidden');
        filterSection.classList.add('grid');
        filterSection.classList.add('col-span-4');
        filterSection.classList.add('mb-4');
        e.target.textContent = 'Hide filters';
      } else {
        filterSection.classList.add('hidden');
        filterSection.classList.remove('grid');
        filterSection.classList.remove('col-span-4');
        filterSection.classList.remove('mb-4');
        e.target.textContent = 'Show filters';
      }
    });
  </script>

{% endblock scripts %}