accessibility_scanner-8.x-1.0-alpha8/templates/wpa-axecore-cli-preview.html.twig

{#
/**
 * @file
 * Template file for the preview report.
 *
 * Available variables:
 * - summary: Object containing summary results.
 * - url: URL this report relates to.
 */
#}

{{ attach_library('accessibility_scanner/axecore') }}
{{ attach_library('accessibility_scanner/google-charts-axecore-cli') }}

{% set status_modifier = summary.is_passing ? 'pass' : 'fail' %}
{% set status_string = summary.is_passing ? 'Pass'|t : 'Fail'|t %}


<div class="axecore-cli-summary axecore-cli-summary--{{ status_modifier }}">
  <h3 class="axecore-cli-summary__url">{{ url }}</h3>

  <div class="axecore-cli-summary__chart"
    data-violations="{{ summary.num_distinct_violations|default(0) }}"
    data-violations-critical="{{ summary.num_distinct_violations_critical|default(0) }}"
    data-violations-serious="{{ summary.num_distinct_violations_serious|default(0) }}"
    data-violations-moderate="{{ summary.num_distinct_violations_moderate|default(0) }}"
    data-violations-minor="{{ summary.num_distinct_violations_minor|default(0) }}"
    data-incomplete="{{ summary.num_distinct_incomplete|default(0) }}"
    data-incomplete-critical="{{ summary.num_distinct_incomplete_critical|default(0) }}"
    data-incomplete-serious="{{ summary.num_distinct_incomplete_serious|default(0) }}"
    data-incomplete-moderate="{{ summary.num_distinct_incomplete_moderate|default(0) }}"
    data-incomplete-minor="{{ summary.num_distinct_incomplete_minor|default(0) }}"
    data-passes="{{ summary.num_distinct_passes|default(0) }}"
    data-passes-critical="{{ summary.num_distinct_passes_critical|default(0) }}"
    data-passes-serious="{{ summary.num_distinct_passes_serious|default(0) }}"
    data-passes-moderate="{{ summary.num_distinct_passes_moderate|default(0) }}"
    data-passes-minor="{{ summary.num_distinct_passes_minor|default(0) }}"></div>
  <p>
  {{ '<strong>Status:</strong> <span class="axecore-cli-summary__status axecore-cli-summary__status--@status_modifier">@status_string</span>'|t({
    '@status_modifier': status_modifier,
    '@status_string': status_string,
  })}}<br>
  {{ '<strong>Standards:</strong> @tags'|t({'@tags': summary.tags })}}<br>
  </p>

  <table>
    <thead>
      <tr>
        <th class="axecore-cli-summary__table_cell--highlighted" scope="col">{{ 'Description'|t }}</th>
        <th class="axecore-cli-summary__table_cell--highlighted" scope="col">{{ 'Distinct'|t }}</th>
        <th class="axecore-cli-summary__table_cell--highlighted" scope="col">{{ 'Total'|t }}</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th scope="row">{{ 'Critical Violations'|t }}</th>
        <td>{{ summary.num_distinct_violations_critical }}</td>
        <td>{{ summary.num_total_violations_critical }}</td>
      </tr>
      <tr>
        <th scope="row">{{ 'Serious Violations'|t }}</th>
        <td>{{ summary.num_distinct_violations_serious }}</td>
        <td>{{ summary.num_total_violations_serious }}</td>
      </tr>
      <tr>
        <th scope="row">{{ 'Moderate Violations'|t }}</th>
        <td>{{ summary.num_distinct_violations_moderate }}</td>
        <td>{{ summary.num_total_violations_moderate }}</td>
      </tr>
      <tr>
        <th scope="row">{{ 'Minor Violations'|t }}</th>
        <td>{{ summary.num_distinct_violations_minor }}</td>
        <td>{{ summary.num_total_violations_minor }}</td>
      </tr>
      <tr>
        <th scope="row">{{ 'Needs Review'|t }}</th>
        <td>{{ summary.num_distinct_incomplete }}</td>
        <td>{{ summary.num_total_incomplete }}</td>
      </tr>
    </tbody>
    <tfoot>
      <tr>
        <th class="axecore-cli-summary__table_cell--highlighted" scope="row">{{ 'All Violations<br><small>(Excluding "Needs Review")</small>'|t }}</th>
        <td class="axecore-cli-summary__table_cell--highlighted">{{ summary.num_distinct_violations }}</td>
        <td class="axecore-cli-summary__table_cell--highlighted">{{ summary.num_total_violations }}</td>
      </tr>
    </tfoot>
  </table>

  {{ view_button }}
</div>