{% extends "global/Page.html" %}
{% load otree %}

{% block content %}

<div>
    <b>
        Bitte bewerten Sie die folgenden Aussagen.
    </b>
</div>
    <table class="likert-table desktop-likert">
        <tr class="top-row">
            <td></td>
            <td class="td-center">stimme überhaupt nicht zu</td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td class="td-center">stimme voll und ganz zu</td>
        </tr>
        <tr>
            <td>{{ form.Pref_i_1.label }}</td>
            {% for choice in form.Pref_i_1 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Pref_i_2.label }}</td>
            {% for choice in form.Pref_i_2 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Pref_i_3.label }}</td>
            {% for choice in form.Pref_i_3 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
    </table>

    <table class="likert-table mobile-likert">
        <tr class="top-row"> 
            <td></td>
            <td colspan="2">stimme überhaupt nicht zu</td>
            <td></td>
            <td></td>
            <td></td>
            <td colspan="2" style="text-align:right;">stimme voll und ganz zu</td>
        </tr>

        <tr>
            <td>{{ form.Pref_i_1.label }}</td>
            {% for choice in form.Pref_i_1 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Pref_i_2.label }}</td>
            {% for choice in form.Pref_i_2 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Pref_i_3.label }}</td>
            {% for choice in form.Pref_i_3 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
</table>

<div class="custom-radio-select mobile-small"> 
    {{ form.Pref_i_1.label }} </br> 
    stimme überhaupt nicht zu
    {% for choice in form.Pref_i_1 %}
        <p>{{ choice }}</p>
    {% endfor %}
    stimme voll und ganz zu
</div>
<div class="custom-radio-select mobile-small"> 
    {{ form.Pref_i_2.label }} </br> 
    stimme überhaupt nicht zu
    {% for choice in form.Pref_i_2 %}
        <p>{{ choice }}</p>
    {% endfor %}
    stimme voll und ganz zu
</div>
<div class="custom-radio-select mobile-small"> 
    {{ form.Pref_i_3.label }} </br> 
    stimme überhaupt nicht zu
    {% for choice in form.Pref_i_3 %}
        <p>{{ choice }}</p>
    {% endfor %}
    stimme voll und ganz zu
</div>


<button class="otree-btn-next btn btn-primary div-margin-top">Weiter</button>
{% endblock %}