{% autoescape %}

<!-- <div class="well"> -->
<div class="panel panel-default">
    <div class="panel-heading">Tópicos</div>
    <div class="panel-body">
    <!-- <ul class="list-group"> -->
        {% for t in state %}
        <!-- <li class="list-group-item"> -->
            <p>{{ t[0] }}</p>

            <div class="progress">
              <div class="progress-bar {{ 'progress-bar-success' if t[1]>=0.9 else 'progress-bar-danger' }}" role="progressbar" aria-valuenow="{{ 100*t[1] }}" aria-valuemin="0" aria-valuemax="100" style="min-width: 1em;width: {{ 100*t[1] }}%">

              </div>
            </div>
        <!-- </li> -->
        {% end %}
    <!-- </ul> -->
    </div>
</div>