54 lines
1.5 KiB
Plaintext
54 lines
1.5 KiB
Plaintext
---
|
|
layout: layouts/post.njk
|
|
structuredData: none
|
|
---
|
|
{{ content | safe }}
|
|
<section class="quiz">
|
|
<form onsubmit="handleQuizSubmit(); return false">
|
|
{% for question in questions %}
|
|
{% set q = loop.index %}
|
|
<div class="questionBox">
|
|
<p class="quizQuestion">{{ q }}. {{ question.title }}</p>
|
|
{% if question.image %}
|
|
<figure>
|
|
<a href="{{ question.image }}">
|
|
<img src="{{ question.image }}" alt="{{ question.imageAlt }}">
|
|
</a>
|
|
{% if question.imageCaption %}
|
|
<figcaption>{{ question.imageCaption }}</figcaption>
|
|
{% endif %}
|
|
</figure>
|
|
{% endif %}
|
|
<div class="answersBox">
|
|
{% for answer in question.answers %}
|
|
<div class="answerBox">
|
|
<input class="answer" type="radio" value="{{ answer.points }}" id="q{{ q }}a{{ loop.index }}" name="{{ q }}" required>
|
|
<label for="q{{ q }}a{{ loop.index }}">{{ answer.name }}</label>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
<script src="/js/quiz.js"></script>
|
|
<button>Submit</button>
|
|
</form>
|
|
</section>
|
|
|
|
{% for consequence in consequences %}
|
|
<dialog class="consequence" data-points-threshold="{{ consequence.points }}">
|
|
<h2>{{ consequence.title }}</h2>
|
|
<p>{{ consequence.spiel }}</p>
|
|
{% if consequence.image %}
|
|
<img src="{{ consequence.image }}" alt="{{ consequence.imageAlt }}">
|
|
{% endif %}
|
|
<details>
|
|
<summary>Score Details</summary>
|
|
<p class="scoreDetails"></p>
|
|
</details>
|
|
<form method="dialog">
|
|
<button>Thanks</button>
|
|
</form>
|
|
</dialog>
|
|
{% endfor %}
|
|
|