webform-progress.html.twig in Webform 8.5

Default theme implementation for webform wizard progress.

Available variables:

• webform: A webform.
• pages: Array of wizard pages.
• current_page: Current wizard page.
• index: Index of the current page.
• total: Total number of pages.
• summary: Summary of progress.
• percentage: Percentage completed.
• bar: A progress bar.

See also

template_preprocess_webform_progress()

4 theme calls to webform-progress.html.twig

template_preprocess_webform_confirmation in includes/webform.theme.template.inc

Prepares variables for webform confirmation templates.

WebformSubmissionForm::form in src/WebformSubmissionForm.php

Gets the actual form array to be built.

webform_cards_preprocess_webform_confirmation in modules/webform_cards/webform_cards.module

Implements hook_preprocess_webform_confirmation() for webform cards.

webform_cards_webform_submission_form_alter in modules/webform_cards/webform_cards.module

Implements hook_webform_submission_form_alter().

File

templates/webform-progress.html.twig

{#
/**
 * @file
 * Default theme implementation for webform wizard progress.
 *
 * Available variables:
 * - webform: A webform.
 * - pages: Array of wizard pages.
 * - current_page: Current wizard page.
 * - index: Index of the current page.
 * - total: Total number of pages.
 * - summary: Summary of progress.
 * - percentage: Percentage completed.
 * - bar: A progress bar.
 *
 * @see template_preprocess_webform_progress()
 *
 * @ingroup themeable
 */
#}
{{ attach_library('webform/webform.progress') }}

<div class="webform-progress">

  {{ bar }}

  {% if summary or percentage %}
    <div class="webform-progress__status">
      {% if summary %}
        <span class="webform-progress__summary" data-webform-progress-summary>{{ summary }}</span>
        {% if percentage %}
          <span class="webform-progress__percentage">(<span data-webform-progress-percentage>{{ percentage }}</span>)</span>
        {% endif %}
      {% else %}
        <span class="webform-progress__percentage" data-webform-progress-percentage>{{ percentage }}</span>
      {% endif %}
    </div>
  {% endif %}

</div>