{% load i18n %}

<div class="progress">
  {% if approved %}
  <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="{{ approved }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ approved }}%;" title="{% trans "Approved" %}"></div>
  {% endif %}
  {% if good %}
  <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="{{ good }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ good }}%;" title="{% trans "Good" %}"></div>
  {% endif %}
  {% if checks %}
  <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="{{ checks }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ checks }}%;" title="{% trans "Failing checks" %}"></div>
  {% endif %}
  {% if fuzzy %}
  <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="{{ fuzzy }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ fuzzy }}%;" title="{% trans "Needs editing" %}"></div>
  {% endif %}
</div>
