{% extends "app_elecciones/base.html" %}
{% load static %}
{% load widget_tweaks %}


{% block head %}

<meta http-equiv="refresh" content="30" />
  
{% endblock head %}
  

{% block cabecera %}

<nav class="navbar navbar-expand-lg navbar-light bg-light">

    <div class="container">
        
            <div class="col-3" style="text-align: center;">
              
              {% if request.path != '/resultados_general/' %}
              <a href="/lista_mesas"> <img class="img-fluid" src="{% static 'img/elecciones/logoelecciones.png' %}" alt="logo" style="width: 80px;"> </a>                
              {% else %}
              <img class="img-fluid" src="{% static 'img/elecciones/logoelecciones.png' %}" alt="logo" style="width: 80px;">
              {% endif %}
                
            </div>
            
            <div class="col-6" style="text-align: center;">
                <p style="text-align: center; color: #333333; font-weight: bold;">Resultados Yepes</p>

            </div>
            <div class="col-3" style="text-align: center;">
                <img class="img-fluid" src="{% static 'img/elecciones/pptomas.png' %}" alt="logo Tomás" style="width: 80px;">
            </div>
    </div>

</nav>
            
{% endblock cabecera %}

{% block contenido %}

<div class="container">

    <table class="table">
        <thead>
          <tr>
            <th scope="col" colspan="2"> Votos Totales: {{ votostotales }}</th>
            <th scope="col" colspan="2" style="text-align: right;">% Escrutinio: {{ escrutinio }}</th>
          </tr>
          <tr>
            <th scope="col"></th>
            <th scope="col"  style="text-align: center;">Total Votos</th>
            <th scope="col"  style="text-align: center;">% Votos</th>
            <th scope="col"  style="text-align: center;">Concejales</th>
          </tr>
        </thead>
        <tbody>
          
          {% for resultado in resultados %}
          <tr>
            <th scope="row"><img class="img-fluid" src="/static/img/elecciones/{{ resultado.0 }}" alt="logo" style="width: 50px;"></th>
            <td style="text-align: center;"><label id="votos">{{ resultado.1 }}</label></td>
            <td style="text-align: center;"><label id="porcentaje">{{ resultado.2 }}</label></td>
            <td style="text-align: center; font-size: 1.2em; font-weight: bold;"><label id="concejales">{{ resultado.3 }}</label></td>
          </tr>            
          {% endfor %}

          <tr>
            <td colspan="4"></td>
          </tr>
          
          <tr>
            <td colspan="4" style="text-align: center;">              
              {% for resultado in resultados %}
              <div style="display: inline-block; width: {{ resultado.5 }}%; height: 2em; background-color: {{ resultado.4 }} ;"><label style="color: aliceblue; font-size: 1.2.em; font-weight: bold;">{{ resultado.3 }}</label></div>
              {% endfor %}
                
            </td>
          </tr>
          
        </tbody>
      </table>

</div>

{% endblock contenido %}