<html> <head> <title>Azube</title> {% include 'head.html' %} </head> <body class="bg-gray-100 min-h-screen"> {% include 'header.html' with title="Deine Berichtshefte" center=False %} <div class="bg-gray-100 min-h-screen"> {% if late_reports > 1 %} <div class="bg-yellow-100 border-l-4 border-yellow-500 text-yellow-700 p-4 mr-10 ml-10 mt-6" role="alert"> <p class="font-bold"> Du bist nicht aktuell! </p> <p> Du hast noch {{ late_reports }} Berichtshefte nachzuschreiben. </p> </div> {% endif %} {% if reports|length == 0 %} <h3 class="text-xl justify-center flex m-10 p-5">wau, such empty!</h3> <button onclick="location = '/write'" class="{{ style.red_btn }} justify-center"> Füge dein erstes Berichtsheft hinzu! </button> {% else %} <div class="mb-5 -mt-5 flex items-center justify-center grid sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5" > {% for report in reports %} {% if forloop.first %} {% if report.week != week_now %} <a href="/write" class="{{ style.card }} flex items-center justify-center" title="Neues Berichtsheft"> <span class="text-9xl font-bold"> + </span> </a> {% endif %} {% endif %} {% include 'component/report.html' with report=report %} {% endfor %} <div hx-get="/reports?page=2" hx-trigger="revealed" hx-swap="outerHTML"> {% endif %} </div> </div> </body> </html>