henrik2399/qivip
1
0
Fork 0
Code Issues 24 Pull Requests 14 Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of edugit.org:enrichment-2024/qivip

Browse Source
This commit is contained in:
ben8
2025-03-15 11:19:15 +01:00
parent 434d1f63e3 e3bd3c8579
commit a0e31d77f2
9 changed files with 137 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
core/library/views.py
View File

@@ -100,7 +100,7 @@ def new_question(request):
return redirect(f'{base_url}?type=multiple_choice&quiz_id={quiz_id}') return redirect(f'{base_url}?type=multiple_choice&quiz_id={quiz_id}')
if request.method == 'POST': if request.method == 'POST':
question_text = request.POST.get('question') question_text = request.POST.get('question', '')
# Handle different question types # Handle different question types
if question_type == 'true_false': if question_type == 'true_false':
@@ -140,27 +140,28 @@ def new_question(request):
question = QivipQuestion() question = QivipQuestion()
question.data = json.dumps(json_data) question.data = json.dumps(json_data)
question.quiz_id = quiz question.quiz_id = quiz
question.type = question_type
question.question = question_text
question.save() question.save()
return redirect('library:detail_quiz', pk=quiz.pk) return redirect('library:detail_quiz', pk=quiz.pk)
else: else:
# Initialize empty question data for new questions # Initialize empty question data for new questions
if question_type == 'true_false':
question_data = { question_data = {
'type': question_type, 'type': question_type,
'question': '', 'question': '',
'options': [] 'options': [
}
if question_type == 'true_false':
question_data['options'] = [
{'value': 'Wahr', 'is_correct': True}, {'value': 'Wahr', 'is_correct': True},
{'value': 'Falsch', 'is_correct': False} {'value': 'Falsch', 'is_correct': False}
] ]
}
elif question_type == 'multiple_choice': elif question_type == 'multiple_choice':
question_data['options'] = [ question_data = {
'type': question_type,
'question': '',
'options': [
{'value': '', 'is_correct': False}, {'value': '', 'is_correct': False},
{'value': '', 'is_correct': False} {'value': '', 'is_correct': False}
] ]
}
template_name = f'library/question/question_{question_type}.html' template_name = f'library/question/question_{question_type}.html'
context = { context = {
@@ -179,11 +180,53 @@ def edit_question(request, pk):
return redirect('library:question_list') return redirect('library:question_list')
# Parse the existing JSON data # Parse the existing JSON data
try:
question_data = json.loads(question.data) if question.data else {} question_data = json.loads(question.data) if question.data else {}
question_type = question_data.get('type', 'multiple_choice') question_type = question_data.get('type', 'multiple_choice')
# For true/false questions, get the correct answer from the options
if question_type == 'true_false':
# Default to true if no options exist
correct_answer = True
if question_data.get('options'):
correct_answer = question_data['options'][0].get('is_correct', True)
question_data = {
'type': question_type,
'question': question_data.get('question', ''),
'correct_answer': correct_answer, # Add this for template compatibility
'options': [
{'value': 'Wahr', 'is_correct': correct_answer},
{'value': 'Falsch', 'is_correct': not correct_answer}
]
}
else:
# For multiple choice questions
question_data.setdefault('type', question_type)
question_data.setdefault('question', '')
question_data.setdefault('options', [])
except (json.JSONDecodeError, AttributeError):
# Handle invalid JSON or None data
question_type = question_data.get('type', 'multiple_choice')
if question_type == 'true_false':
question_data = {
'type': question_type,
'question': '',
'correct_answer': True, # Default to true for new questions
'options': [
{'value': 'Wahr', 'is_correct': True},
{'value': 'Falsch', 'is_correct': False}
]
}
else:
question_data = {
'type': question_type,
'question': '',
'options': []
}
if request.method == 'POST': if request.method == 'POST':
question_text = request.POST.get('question') question_text = request.POST.get('question', '')
# Handle different question types # Handle different question types
if question_type == 'true_false': if question_type == 'true_false':
@@ -191,7 +234,6 @@ def edit_question(request, pk):
json_data = { json_data = {
'type': question_type, 'type': question_type,
'question': question_text, 'question': question_text,
'correct_answer': correct_answer,
'options': [ 'options': [
{'value': 'Wahr', 'is_correct': correct_answer}, {'value': 'Wahr', 'is_correct': correct_answer},
{'value': 'Falsch', 'is_correct': not correct_answer} {'value': 'Falsch', 'is_correct': not correct_answer}
@@ -205,7 +247,7 @@ def edit_question(request, pk):
options.append({ options.append({
'order': i, 'order': i,
'value': request.POST.get(f'option_{i}'), 'value': request.POST.get(f'option_{i}'),
'is_correct': int(request.POST.get(f'correct_{i}', 0)) 'is_correct': request.POST.get(f'correct_{i}') == '1'
}) })
i += 1 i += 1
@@ -225,17 +267,13 @@ def edit_question(request, pk):
'options': options 'options': options
} }
question.question = question_text
question.type = question_type
question.data = json.dumps(json_data) question.data = json.dumps(json_data)
question.save() question.save()
return redirect('library:detail_quiz', pk=question.quiz_id.pk) return redirect('library:detail_quiz', pk=question.quiz_id.pk)
else: else:
question_data = json.loads(question.data) if question.data else {}
template_name = f'library/question/question_{question_type}.html' template_name = f'library/question/question_{question_type}.html'
context = { context = {
'question': question_data, 'question': {'data': question_data}, # Wrap in data structure expected by template
'quiz_id': question.quiz_id.pk, 'quiz_id': question.quiz_id.pk,
'quiz': question.quiz_id 'quiz': question.quiz_id
} }

2
core/templates/accounts/home.html
View File

@@ -3,7 +3,7 @@
{% block content %} {% block content %}
<div class="max-w-screen-lg mx-auto mt-12"> <div class="flex justify-center items-center mt-12 ">
<div class="input-group p-4 m-2 border-blue-600 border-2 rounded-xl shadow-md"> <div class="input-group p-4 m-2 border-blue-600 border-2 rounded-xl shadow-md">
<div class="grid place-content-center h-120"> <div class="grid place-content-center h-120">

2
core/templates/base.html
View File

@@ -5,7 +5,7 @@
<link rel="icon" type="image/png" href="{% static 'icons/favicon.png' %}"> <link rel="icon" type="image/png" href="{% static 'icons/favicon.png' %}">
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="{% static 'homepage/t-style.css' %}"> <link rel="stylesheet" href="{% static 'css/t-style.css' %}">
<title>qivip</title> <title>qivip</title>
</head> </head>
<body> <body>

2
core/templates/library/delete_confirmation.html
View File

@@ -3,7 +3,7 @@
{% block content %} {% block content %}
<div class="container mx-auto px-4"> <div class="container mx-auto px-4">
<div class="max-w-lg mx-auto mt-10"> <div class="max-w-lg mx-auto mt-10">
<div class="bg-white rounded-lg shadow-md p-6"> <div class="bg-white rounded-lg shadow-md p-6 border-blue-600 border-2 rounded-xl shadow-md">
<div class="text-center"> <div class="text-center">
<svg class="mx-auto h-12 w-12 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="mx-auto h-12 w-12 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>

41
core/templates/library/detail_quiz.html
View File

@@ -5,8 +5,8 @@
<div class="flex justify-between items-center mb-6"> <div class="flex justify-between items-center mb-6">
<h1 class="text-2xl font-bold">{{ quiz.name }}</h1> <h1 class="text-2xl font-bold">{{ quiz.name }}</h1>
<div class="flex space-x-2"> <div class="flex space-x-2">
<a href="{% url 'library:edit_quiz' quiz.id %}" class="bg-blue-500 text-white px-4 py-2 rounded-md hover:bg-blue-600 transition-colors">Bearbeiten</a> <a href="{% url 'library:edit_quiz' quiz.id %}" class="bg-green-500 text-white px-4 py-2 rounded-md text-sm lg:text-lg hover:bg-green-600 transition-colors">Quiz bearbeiten</a>
<a href="{% url 'library:delete_quiz' quiz.id %}" class="bg-red-500 text-white px-4 py-2 rounded-md hover:bg-red-600 transition-colors">Löschen</a> <a href="{% url 'library:delete_quiz' quiz.id %}" class="bg-red-500 text-white px-4 py-2 rounded-md text-sm lg:text-lg hover:bg-red-600 transition-colors">Quiz löschen</a>
</div> </div>
</div> </div>
@@ -14,17 +14,17 @@
<p class="text-gray-600 mb-8">{{ quiz.description }}</p> <p class="text-gray-600 mb-8">{{ quiz.description }}</p>
{% endif %} {% endif %}
<div class="bg-white rounded-lg shadow-md"> <div class="bg-white rounded-lg shadow-md border-blue-600 border-2 rounded-xl shadow-md">
<div class="border-b border-gray-200 p-4"> <div class="border-b border-gray-200 p-4">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<h2 class="text-xl font-semibold">Fragen</h2> <h2 class="text-xl font-semibold">Fragen</h2>
<div class="flex space-x-2"> <div class="flex space-x-2">
<a href="{% url 'library:new_question' %}?type=multiple_choice&quiz_id={{ quiz.id }}" <a href="{% url 'library:new_question' %}?type=multiple_choice&quiz_id={{ quiz.id }}"
class="bg-green-500 text-white px-4 py-2 rounded-md hover:bg-green-600 transition-colors"> class="bg-blue-100 text-blue-800 px-4 py-2 rounded-md text-xs lg:text-lg hover:border-blue-600 border-2">
Multiple Choice Multiple Choice
</a> </a>
<a href="{% url 'library:new_question' %}?type=true_false&quiz_id={{ quiz.id }}" <a href="{% url 'library:new_question' %}?type=true_false&quiz_id={{ quiz.id }}"
class="bg-green-500 text-white px-4 py-2 rounded-md hover:bg-green-600 transition-colors"> class="bg-purple-100 text-purple-800 px-4 py-2 rounded-md text-xs lg:text-lg hover:border-blue-600 border-2">
Wahr/Falsch Wahr/Falsch
</a> </a>
</div> </div>
@@ -32,10 +32,14 @@
</div> </div>
{% if questions %} {% if questions %}
<div class="divide-y divide-gray-200"> <div class="divide-y divide-gray-200">
{% for question in questions %} {% for question in questions %}
<div class="p-4 hover:bg-gray-50">
<div class="w-full rounded-xl p-4 hover:bg-gray-50">
<a class="block flex h-full w-full" href="{% url 'library:edit_question' question.id %}" >
<div class="flex justify-between items-start"> <div class="flex justify-between items-start">
<div class="flex-grow"> <div class="flex-grow">
<p class="font-medium">{{ question.data.question }}</p> <p class="font-medium">{{ question.data.question }}</p>
<div class="mt-1"> <div class="mt-1">
@@ -63,30 +67,41 @@
{% endfor %} {% endfor %}
</ul> </ul>
{% else %} {% else %}
{% for option in question.data.options %}
{% if option.is_correct %}
<p class="text-sm"> <p class="text-sm">
<span class="text-gray-500">Richtige Antwort:</span> <span class="text-gray-500">Richtige Antwort:</span>
<span class="ml-1 font-medium {% if question.data.correct_answer %}text-green-700{% else %}text-red-700{% endif %}"> <span class="ml-1 font-medium {% if option.value == "Wahr" %} text-green-700 {% else %}text-red-700{% endif %}">{{ option.value }}</span>
{% if question.data.correct_answer %}Wahr{% else %}Falsch{% endif %}
</span>
</p> </p>
{% endif %} {% endif %}
{% endfor %}
{% endif %}
</div> </div>
</div> </div>
<div class="flex space-x-2 ml-4">
<div class="flex h-full space-x-2 ml-4 items-center">
<!--
<a href="{% url 'library:edit_question' question.id %}" <a href="{% url 'library:edit_question' question.id %}"
class="bg-gray-100 text-gray-700 px-3 py-1 rounded hover:bg-gray-200 transition-colors"> class="bg-gray-100 text-gray-700 px-3 py-1 rounded hover:bg-gray-200 transition-colors">
Bearbeiten Bearbeiten
</a> </a>
<a href="{% url 'library:delete_question' question.id %}" -->
class="bg-red-100 text-red-700 px-3 py-1 rounded hover:bg-red-200 transition-colors">
Löschen <a href=" {% url 'library:delete_question' question.id %}"
class=" text-red-700 px-4 py-1 rounded hover:scale-110 ">
&#x1F5D1
</a> </a>
</div> </div>
</div> </div>
</div> </div>
</a>
{% endfor %} {% endfor %}
</div> </div>
{% else %} {% else %}
<div class="p-8 text-center"> <div class="p-8 text-center">
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>

2
core/templates/library/form.html
View File

@@ -3,7 +3,7 @@
{% block content %} {% block content %}
<h1>Formular</h1> <h1>Formular</h1>
<h2>{{ form.name.value }}</h2> <h2>{{ form.name.value }}</h2>
<div class="input-group"> <div class="input-group border-blue-600 border-2 rounded-xl shadow-md">
<form method="post"> <form method="post">
{% csrf_token %} {% csrf_token %}
{{ form.as_p }} {{ form.as_p }}

25
core/templates/library/overview_quiz.html
View File

@@ -3,16 +3,25 @@
{% block content %} {% block content %}
<h1>Übersicht</h1> <h1>Übersicht</h1>
<div class="flex justify-end"> <div class="flex justify-end">
<a href="{% url 'library:new_quiz' %}" class="text-white bg-blue-500 text-white px-4 py-2 rounded-md mb-12">Neues Quiz erstellen</a> <a href="{% url 'library:new_quiz' %}" class="text-white bg-blue-500 px-4 py-2 rounded-md mb-12">Neues Quiz erstellen</a>
</div> </div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 px-4 place-items-center">
{% for quiz in quizzes %} {% for quiz in quizzes %}
<div class="bg-white rounded-lg p-4 shadow-md border-blue-600 border-2 rounded-xl shadow-md "> <div class="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"><a href="{% url 'library:detail_quiz' quiz.id %}">{{ quiz.name }}</a></h2> <h2 class="text-lg font-bold"><a href="{% url 'library:edit_quiz' quiz.id %}">{{ quiz.name }}</a></h2>
<p class="text-sm text-gray-600 my-8">{{ quiz.description }}</p> <p class="text-sm text-gray-600 py-12">{{ quiz.description }}</p>
<a href="#"class="qp-a-button-small bg-green-500 text-white ">Spiel starten</a>
<button><a href="{% url 'library:edit_quiz' quiz.id %}"class="qp-a-button-small bg-indigo-500 text-white">Bearbeiten</a></button> <div>
<a href="{% url 'library:delete_quiz' quiz.id %}" class="qp-a-button-small bg-purple-500 text-white">Löschen</a> <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">&#x270F;</a>
<a href="{% url 'library:delete_quiz' quiz.id %}" class="qp-a-button-small border-2 border-blue-600 text-white">&#x1F5D1;</a>
</div>
</div>
</div>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>

22
core/templates/library/question/question_multiple_choice.html
View File

@@ -18,9 +18,9 @@
<div> <div>
<label for="question" class="block text-sm font-medium text-gray-700">Frage</label> <label for="question" class="block text-sm font-medium text-gray-700">Frage</label>
<div class="mt-1"> <div class="mt-1">
<input type="text" name="question" id="question" <textarea name="question" id="question" rows="4"
class="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md" class="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
value="{{ question.data.question|default:'' }}" required> required>{{ question.data.question|default:'' }}</textarea>
</div> </div>
</div> </div>
@@ -31,9 +31,9 @@
{% if question and question.data.options %} {% if question and question.data.options %}
{% for option in question.data.options %} {% for option in question.data.options %}
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<input type="text" name="option_{{ forloop.counter }}" <textarea name="option_{{ forloop.counter }}" rows="2"
class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md" class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md"
value="{{ option.value }}" required> required>{{ option.value }}</textarea>
<label class="inline-flex items-center"> <label class="inline-flex items-center">
<input type="checkbox" name="correct_{{ forloop.counter }}" value="1" <input type="checkbox" name="correct_{{ forloop.counter }}" value="1"
class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"
@@ -50,9 +50,9 @@
{% endfor %} {% endfor %}
{% else %} {% else %}
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<input type="text" name="option_1" <textarea name="option_1" rows="2"
class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md" class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md"
required> required></textarea>
<label class="inline-flex items-center"> <label class="inline-flex items-center">
<input type="checkbox" name="correct_1" value="1" <input type="checkbox" name="correct_1" value="1"
class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"> class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded">
@@ -66,9 +66,9 @@
</button> </button>
</div> </div>
<div class="flex items-center space-x-3"> <div class="flex items-center space-x-3">
<input type="text" name="option_2" <textarea name="option_2" rows="2"
class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md" class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md"
required> required></textarea>
<label class="inline-flex items-center"> <label class="inline-flex items-center">
<input type="checkbox" name="correct_2" value="1" <input type="checkbox" name="correct_2" value="1"
class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"> class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded">
@@ -119,9 +119,9 @@ function addOption() {
const div = document.createElement('div'); const div = document.createElement('div');
div.className = 'flex items-center space-x-3'; div.className = 'flex items-center space-x-3';
div.innerHTML = ` div.innerHTML = `
<input type="text" name="option_${optionCount}" <textarea name="option_${optionCount}" rows="2"
class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md" class="shadow-sm focus:ring-blue-500 focus:border-blue-500 flex-grow sm:text-sm border-gray-300 rounded-md"
required> required></textarea>
<label class="inline-flex items-center"> <label class="inline-flex items-center">
<input type="checkbox" name="correct_${optionCount}" value="1" <input type="checkbox" name="correct_${optionCount}" value="1"
class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"> class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded">
@@ -153,7 +153,7 @@ function updateOptionNumbers() {
const options = container.children; const options = container.children;
Array.from(options).forEach((option, index) => { Array.from(options).forEach((option, index) => {
const number = index + 1; const number = index + 1;
const textInput = option.querySelector('input[type="text"]'); const textInput = option.querySelector('textarea');
const checkbox = option.querySelector('input[type="checkbox"]'); const checkbox = option.querySelector('input[type="checkbox"]');
textInput.name = `option_${number}`; textInput.name = `option_${number}`;

8
core/templates/library/question/question_true_false.html
View File

@@ -18,9 +18,9 @@
<div> <div>
<label for="question" class="block text-sm font-medium text-gray-700">Frage</label> <label for="question" class="block text-sm font-medium text-gray-700">Frage</label>
<div class="mt-1"> <div class="mt-1">
<input type="text" name="question" id="question" <textarea name="question" id="question" rows="4"
class="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md" class="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
value="{{ question.question|default:'' }}" required> required>{{ question.data.question }}</textarea>
</div> </div>
</div> </div>
@@ -31,13 +31,13 @@
<label class="inline-flex items-center"> <label class="inline-flex items-center">
<input type="radio" name="correct_answer" value="true" <input type="radio" name="correct_answer" value="true"
class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300"
{% if question.correct_answer %}checked{% endif %}> {% if question.data.correct_answer %}checked{% endif %}>
<span class="ml-2 text-sm text-gray-600">Wahr</span> <span class="ml-2 text-sm text-gray-600">Wahr</span>
</label> </label>
<label class="inline-flex items-center"> <label class="inline-flex items-center">
<input type="radio" name="correct_answer" value="false" <input type="radio" name="correct_answer" value="false"
class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300"
{% if not question.correct_answer %}checked{% endif %}> {% if not question.data.correct_answer %}checked{% endif %}>
<span class="ml-2 text-sm text-gray-600">Falsch</span> <span class="ml-2 text-sm text-gray-600">Falsch</span>
</label> </label>
</div> </div>