{{ block content }}
<b>Now, we want to know how you felt when learning about this pair.</b>
<p>
Remember, the two agents completed the task for 4 minutes. 
Agent A completed Version A of the task, while Agent B completed Version B of the task.
After they completed the task, we matched both agents to form a pair.
</p>
<p>
Agent A solved more correct tables than Agent B, and was initially assigned all of the 6 USD bonus.
</p>
<br>

<div class="card">
    <div class=card-header>
        <b>When learning about it, how much did you feel each of the following?</b>
    </div>
    <div class="card-body">
        <p>
        <div {{ if 'anger' in form.errors }} class="border border-danger px-3 rounded" {{ endif }}>
            {{ formfield 'anger' label='<b>Anger</b>'}}
        </div> 
        </p>
        <p>
        <div {{ if 'compassion' in form.errors }} class="border border-danger px-3 rounded" {{ endif }}>
            {{ formfield 'compassion' label='<b>Compassion</b>'}}
        </div> 
        </p>
        <p>
        <div {{ if 'sadness' in form.errors }} class="border border-danger px-3 rounded" {{ endif }}>
            {{ formfield 'sadness' label='<b>Sadness</b>'}}
        </div> 
        </p>
        <p>
        <div {{ if 'indifference' in form.errors }} class="border border-danger px-3 rounded" {{ endif }}>
            {{ formfield 'indifference' label='<b>Indifference</b>'}}
        </div> 
        </p>
        <p>
        <div {{ if 'irritation' in form.errors }} class="border border-danger px-3 rounded" {{ endif }}>
            {{ formfield 'irritation' label='<b>Irritation</b>'}}
        </div>
        </p>
    </div>
</div>
<br>
<br>

<button class="otree-btn-next btn btn-dark btn-primary">Next</button>

{{ endblock }}

{{ block style }}
    <link rel="stylesheet" href="{% static 'global/style.css' %}"/>
{{ endblock }}