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

{% block content %}

    <div>
        <b>
            Basierend auf Ihrer Erfahrung mit dem kostenlosen Angebot an Nachrichtenartikeln…
        </b>
    </div>
    
    <table class="likert-table desktop-likert">
        <tr class="top-row"> 
            <td></td>
            <td class="td-center">sehr wenig</td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td class="td-center">sehr stark</td>
        </tr>
        <tr>
            <td>{{ form.Cur_1.label }}</td>
            {% for choice in form.Cur_1 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Cur_2.label }}</td>
            {% for choice in form.Cur_2 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Cur_3.label }}</td>
            {% for choice in form.Cur_3 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
    </table>

    <table class="likert-table mobile-likert">
        <tr class="top-row"> 
            <td></td>
            <td colspan="3">sehr wenig</td>
            <td></td>
            <td colspan="3" style="text-align:right;">sehr stark</td>
        </tr>
        <tr>
            <td>{{ form.Cur_1.label }}</td>
            {% for choice in form.Cur_1 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Cur_2.label }}</td>
            {% for choice in form.Cur_2 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
        <tr>
            <td>{{ form.Cur_3.label }}</td>
            {% for choice in form.Cur_3 %}
                <td>{{ choice }}</td>
            {% endfor %}
        </tr>
    </table>

    <div class="custom-radio-select mobile-small"> 
        {{ form.Cur_1.label }} </br> 
        sehr wenig
        {% for choice in form.Cur_1 %}
            <p>{{ choice }}</p>
        {% endfor %}
        sehr stark
    </div>
    <div class="custom-radio-select mobile-small"> 
        {{ form.Cur_2.label }} </br> 
        sehr wenig
        {% for choice in form.Cur_2 %}
            <p>{{ choice }}</p>
        {% endfor %}
        sehr stark
    </div>
    <div class="custom-radio-select mobile-small"> 
        {{ form.Cur_3.label }} </br> 
        sehr wenig
        {% for choice in form.Cur_3 %}
            <p>{{ choice }}</p>
        {% endfor %}
        sehr stark
    </div>

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