ice_breaking_challenge/templates/quiz.html

{% extends 'base.html' %}

{% block content %}
  <h1>퀴즈 생성 결과</h1>

  {% if quiz %}
    <ul>
          <h2>문제 주인: {{ quiz[0] }}</h2> <!-- 이름 부분 -->
          <h3>질문: {{ quiz[1] }}</h3> <!-- 질문 부분 -->
          <ul>
            {{ quiz[2] }} <!-- 4지선다 보기 -->
          </ul>
          <button onclick="showAnswer()">정답 보기</button>
          <p id="answer" style="display: none;">정답: {{ quiz[3] }}</p> <!-- 정답 -->
    </ul>
  {% else %}
    <p>퀴즈가 없습니다. 다시 시도해 주세요.</p>
  {% endif %}
    <form method="post" style="margin-top: 20px;">
      <input type="submit" value="다음" style="padding: 10px 20px; font-size: 16px; cursor: pointer; border-radius: 5px; border: none; background-color: #2980b9; color: white;">
    </form>

  <script>
    function showAnswer() {
      const answer = document.getElementById(`answer`);
      if (answer.style.display === "none") {
        answer.style.display = "block";
      } else {
        answer.style.display = "none";
      }
    }
  </script>
{% endblock %}