{% extends 'physics/exams.html' %}
{% block navigation %}
    {{ block.super }}
    {% include 'generic/exam_overview_headers.html' %}
{% endblock navigation %}

{% block content %}

    {% load thumbnail %}
    <div class="physics">

        This exam will be available to take <a href="{% url 'physics:exam_start' pk=exam.pk %}">here</a> (when active).

        {% autoescape off %}
            <ol id="full-question-list-physics">
                {% for question in questions.all %}

                    <li>
                        {{ question.stem }}
                        <ol type="a" class="abcde">
                            <li class="question-a">
                                <span class="question-text">{{ question.a }}</span>: <span class="question-answer">{{ question.a_answer }}</span>
                                {% if question.a_feedback %}
                                    <span class="question-feedback">{{question.a_feedback}}</span>
                                {% endif %}
                            </li>
                            <li class="question-b">
                                <span class="question-text">{{ question.b }}</span>: <span class="question-answer">{{ question.b_answer }}</span>
                                {% if question.b_feedback %}
                                    <span class="question-feedback">{{question.b_feedback}}</span>
                                {% endif %}
                            </li>
                            <li class="question-c">
                                <span class="question-text">{{ question.c }}</span>: <span class="question-answer">{{ question.c_answer }}</span>
                                {% if question.c_feedback %}
                                    <span class="question-feedback">{{question.c_feedback}}</span>
                                {% endif %}
                            </li>
                            <li class="question-d">
                                <span class="question-text">{{ question.d }}</span>: <span class="question-answer">{{ question.d_answer }}</span>
                                {% if question.d_feedback %}
                                    <span class="question-feedback">{{question.d_feedback}}</span>
                                {% endif %}
                            </li>
                            <li class="question-e">
                                <span class="question-text">{{ question.e }}</span>: <span class="question-answer">{{ question.e_answer }}</span>
                                {% if question.e_feedback %}
                                    <span class="question-feedback">{{question.e_feedback}}</span>
                                {% endif %}
                            </li>
                        </ol>
                        Category: {{ question.category }}, <a href="{% url 'physics:question_detail' pk=question.pk %}">View [id: {{question.pk}}]</a> <a
                            href="{% url 'admin:physics_question_change' question.id %}">Edit</a>

                    </li>
                {% endfor %}
            </ol>
        {% endautoescape %}

    </div>
    {% include 'exam_overview_js.html' %}
{% endblock %}
{% block css %}
    <style>
        .question-answer {
            font-weight: bolder;
        }
        .question-feedback {
            opacity: 50%;
            float: right
        }
        .question-feedback::before {
            content: "Feedback: ";
        }
    </style>
{% endblock %}