{% extends "base.html" %}{% load i18n helpers static %}

{% block stylesheets %}
  <link href="{% static 'stylesheets/cla.main.css' %}" media="screen" rel="stylesheet">
{% endblock %}

{% block javascripts %}
  <script src="{% static 'javascripts/cla.main.js' %}"></script>
{% endblock %}

{% block content %}
  <div class="inner">
    <header>
      <h1>{% block page_header %}{% endblock %}</h1>
    </header>

    {% block breadcrumb %}
      <ol class="ProgressIndicator" role="progressbar" aria-valuetext="Step 1 of 5">
        {% for step in steps %}
          <li class="ProgressIndicator-step{% if step == wizard.steps.current %} is-active{% endif %}{% if step in history_data %} is-complete{% endif %}">
            {% if step in history_data %}
              <a href="{% url 'checker:checker_step' step %}" class="ProgressIndicator-tick">{{ step|unslug }}</a>
            {% else %}
              {{ step|unslug }}
            {% endif %}
          </li>
        {% endfor %}
        <li class="ProgressIndicator-step">Result of legal aid check</li>
      </ol>
    {% endblock %}

    {% block checker_content %}{% endblock %}

    {% block summary %}{% endblock summary %}
  </div>
{% endblock %}

{% extends "base.html" %}{% load i18n helpers static %}

{% block stylesheets %}
  <link href="{% static 'stylesheets/cla.main.css' %}" media="screen" rel="stylesheet">
{% endblock %}

{% block javascripts %}
  <script src="{% static 'javascripts/cla.main.js' %}"></script>
{% endblock %}

{% block content %}
  <div class="inner">
    <header>
      <h1>{% block page_header %}{% endblock %}</h1>
    </header>

    {% block breadcrumb %}
      <ol class="ProgressIndicator" role="progressbar" aria-valuetext="Step 1 of {{ steps|length }}">
        {% for step in steps %}
          <li class="ProgressIndicator-step{% if step == wizard.steps.current %} is-active{% endif %}{% if step in history_data %} is-complete{% endif %}">
            {% if step in history_data %}
              <a href="{% url 'checker:checker_step' step %}" class="ProgressIndicator-tick">{{ step|unslug }}</a>
            {% else %}
              {{ step|unslug }}
            {% endif %}
          </li>
        {% endfor %}
        <li class="ProgressIndicator-step">Result of legal aid check</li>
      </ol>
    {% endblock %}

    {% block checker_content %}{% endblock %}

    {% block summary %}{% endblock summary %}
  </div>
{% endblock %}

Use dynamic total step count in progress nav
Use dynamic total step count in progress nav
