105 lines
4.6 KiB
HTML
105 lines
4.6 KiB
HTML
{% extends 'base.html' %}
|
|
{% block content %}
|
|
|
|
|
|
<div class="flex justify-end mr-2">
|
|
<a href="{% url 'library:new_quiz' %}" class="mt-2 p-2 shadow-md border-blue-600 border-2 rounded-md text-black ">Neues Quiz erstellen</a>
|
|
</div>
|
|
<div class="flex justify-end mr-2">
|
|
<a href="{% url 'library:overview_quiz' %}" class="mt-2 p-2 shadow-md border-blue-600 border-2 rounded-md text-black ">Suche und Filter zurücksetzen</a>
|
|
</div>
|
|
|
|
<div class="w-screen flex justify-center items-center">
|
|
<div class="w-full m-4 border-blue-600 border-2 rounded-xl shadow-md p-6 lg:w-1/4">
|
|
<form method="get" class="flex flex-col space-y-4">
|
|
<h1 class="text-xl font-bold">Filter</h1>
|
|
Minimale Anzahl an Fragen {{ form.min_amout_questions }}
|
|
Maximale Anzahl an Fragen {{ form.max_amout_questions }}
|
|
von User {{ form.user }}
|
|
<!-- Rendert die Form-Felder -->
|
|
<button type="submit" class="qp-a-button-small border-2 border-blue-600 text-black">Filtern</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
{% if filter_my_quizzes %}
|
|
<div class="text-center m-8 bg-blue-600 grid mx-8 h-8 place-items-center rounded-xl shadow-md ">
|
|
<h1 id="my-quizzes"class="flex px-4 font-bold text-white ">eigene Quiz</h1></div>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 px-4 place-items-center ">
|
|
{% for quiz in filter_my_quizzes %}
|
|
<div class="bg-white w-full max-w-md rounded-lg p-4 shadow-md border-blue-600 border-2 rounded-xl h-80 ">
|
|
<h2 class="text-lg font-bold break-words truncate"><a href="{% url 'library:edit_quiz' quiz.id %}">{{ quiz.name }}</a></h2>
|
|
<p class="text-sm text-gray-600 pt-11 h-54"><span class="break-words line-clamp-2">{{ quiz.description }} </span><br> Status: <span class="font-bold">{{ quiz.status }}</span>
|
|
<br> Schwierigkeit:<span class="font-bold"> {{ quiz.difficulty }}</span>
|
|
<br> Anzahl der Fragen:<span class="font-bold"> {{ quiz.question.count }}</span> </p>
|
|
|
|
|
|
<div>
|
|
<div class="flex justify-between items-center gap-2">
|
|
<a href="#" class="qp-a-button-small border-2 border-blue-600 text-black">Spiel starten</a>
|
|
|
|
<div class="flex gap-2">
|
|
<a href="{% url 'library:detail_quiz' quiz.id %}" class="qp-a-button-small border-2 border-blue-600 text-white">✏</a>
|
|
<a href="{% url 'library:delete_quiz' quiz.id %}" class="qp-a-button-small border-2 border-blue-600 text-white">🗑</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endfor %}
|
|
{% endif %}
|
|
</div>
|
|
|
|
|
|
|
|
{% if filter_my_quizzes or filter_other_quizzes %}
|
|
<div class="text-center m-8 bg-blue-600 grid mx-8 h-8 place-items-center rounded-xl shadow-md">
|
|
<h1 id="other-quizzes" class="flex px-4 font-bold text-white ">Quiz von anderen Nutzer</h1></div>
|
|
{% endif %}
|
|
{% if filter_other_quizzes %}
|
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 px-4 place-items-center">
|
|
{% for quiz in filter_other_quizzes %}
|
|
|
|
<div class="h-80 bg-white w-full max-w-md rounded-lg p-4 shadow-md border-blue-600 border-2 rounded-xl ">
|
|
<h2 class="text-lg font-bold break-words truncate">{{ quiz.name }}</h2>
|
|
<p class="text-sm text-gray-600 pt-11 h-54"><span class="break-words line-clamp-2">{{ quiz.description }} </span> <br> Schwierigkeit:<span class="font-bold ">
|
|
{{ quiz.difficulty }}</span><br> Anzahl der Fragen:<span class="font-bold"> {{ quiz.question.count }}</span>
|
|
<br>Erstmalig erstellt am:<span class="font-bold"> {{ quiz.creation_date }}</span>
|
|
</p>
|
|
<div>
|
|
<div class="flex justify-between items-center gap-2">
|
|
<a href="#" class="qp-a-button-small border-2 border-blue-600 text-black">Spiel starten</a>
|
|
<div class="flex gap-2">
|
|
<a href="{% url 'library:overview_quiz' %}?user={{ quiz.user_id }}" class=" text-gray-600 text-sm" >
|
|
|
|
<button type="submit" class=" py-1 text-blue-600 hover:text-blue-750">
|
|
Quiz von {{ quiz.user_id }}
|
|
</button>
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
{% endfor %}
|
|
{% elif not filter_my_quizzes %}
|
|
<div class="text-center font-bold">Es wurde kein passendes Quiz gefunden.</div>
|
|
{% else %}
|
|
|
|
|
|
|
|
<div class="text-center font-bold">Es wurde kein passendes Quiz von einem anderen Nutzer gefunden.</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% endblock %}
|