{#
/**
 * @file
 * Theme override to display a view of unformatted rows.
 *
 * Available variables:
 * - title: The title of this group of rows. May be empty.
 * - rows: A list of the view's row items.
 *   - attributes: The row's HTML attributes.
 *   - content: The row's content.
 * - view: The view object.
 * - default_row_class: A flag indicating whether default classes should be
 *   used on rows.
 *
 * @see template_preprocess_views_view_unformatted()
 */
#}
{% if title %}
  <h3>{{ title }}</h3>
{% endif %}

{% set counter = 0 %}
{% for row in rows %}
  {%
    set row_classes = [
      default_row_class ? 'views-row',
      'counter-'~ counter,
    ]
  %}
  <div{{ row.attributes.addClass(row_classes) }}>
    {{- row.content -}}
    <div class="precentage">
        <div class="precentage-row">
            <div class="colored" style="background-color: {{ row.content['#view'].style_plugin.render_tokens[ loop.index0 ]['{{ field_color }}'] }};width: {{ row.content['#view'].style_plugin.render_tokens[ loop.index0 ]['{{ field_precentage }}'] }}%"></div>
        </div>
        <div class="number">{{ row.content['#view'].style_plugin.render_tokens[ loop.index0 ]['{{ field_precentage }}'] }}%</div>
    </div>
    <style>
      .counter-{{ counter }} svg path{
        fill: {{ row.content['#view'].style_plugin.render_tokens[ loop.index0 ]['{{ field_color }}'] }}
      }
    </style>
  </div>
  {% set counter = counter + 1 %}
{% endfor %}