Johan Dahlin
5169a67966
All checks were successful
Deploy Quartz site to GitHub Pages / build (push) Successful in 2m12s
24 lines
1.4 KiB
HTML
24 lines
1.4 KiB
HTML
<div class="quiz-content">
|
|
<h3 style="margin-bottom: 1.5rem;">{{ question.text }}</h3>
|
|
<form hx-post="{% url 'submit_answer' session.id %}" hx-target="#quiz-container-{{ session.id }}">
|
|
{% csrf_token %}
|
|
<input type="hidden" name="question_id" value="{{ question.id }}">
|
|
<div style="display: flex; flex-direction: column; gap: 0.75rem;">
|
|
{% for option in question.options.all %}
|
|
<div class="option"
|
|
style="padding: 1rem; border: 1px solid var(--border); border-radius: 0.5rem; cursor: pointer; transition: all 0.2s;"
|
|
onmouseover="this.style.backgroundColor='#f1f5f9'" onmouseout="this.style.backgroundColor='transparent'"
|
|
onclick="this.querySelector('input').checked = true; this.closest('form').requestSubmit();">
|
|
<input type="radio" name="answer" value="{{ option.letter }}"
|
|
id="opt_{{ session.id }}_{{ question.id }}_{{ option.letter }}" style="display:none;">
|
|
<label style="cursor: pointer; font-weight: 500; color: var(--text-main);"
|
|
for="opt_{{ session.id }}_{{ question.id }}_{{ option.letter }}">
|
|
<span style="display: inline-block; width: 1.5rem; color: var(--primary); font-weight: 700;">{{
|
|
option.letter }}</span>
|
|
{{ option.text }}
|
|
</label>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</form>
|
|
</div> |