{# The line that stays at the top: which question, under which rule, and what came of it.

   Nothing here is a chip that does something except the mechanism, which switches the
   token marking below on and off; the rest state what they state and are not focusable.

   That one states `aria-pressed` in the markup rather than waiting for the script to set
   it, because the marking is on before any script runs and a toggle that announces no state
   is a toggle a screen reader cannot report. With scripting off it is hidden altogether:
   `base.html` carries the rule in a `noscript`, since a button that cannot do what it says
   is worse than no button. Everything else on the page is rendered and degrades as it is.

   The verdict comes first and the question set last: the set is named by its file and, when
   the run was told one, by the origin that file came from, which can be a URL of any length,
   and a chip of two hundred characters would have been the loudest thing on the page. It is
   a line of secondary text under the chips instead.

   The database this question is about goes in front of the set on that same line, where the
   run was published with a `questions.json` naming it. It is not in any file the audit
   writes, so a report of a directory the audit wrote states the set alone, exactly as it did
   before there was such a file. #}
{% macro strip(page) %}
<header class="strip" data-verdict="{{ page.verdict }}">
  <h1 class="strip__title">q{{ page.question_id }}</h1>
  <p class="strip__facts">
    <span class="chip chip--rule">{{ page.replay_rule }}</span>
    <span class="chip chip--verdict chip--{{ page.verdict|lower }}">{{ page.verdict }}</span>
    {% if page.mechanism %}
    <button type="button" class="chip chip--warn chip--mechanism" data-marks="statements" aria-pressed="true">{{ page.mechanism.classification }}</button>
    {% endif %}
    {% for probe in page.probes if probe.fired %}
    <span class="chip chip--warn chip--probe">{{ probe.name }}</span>
    {% endfor %}
  </p>
  <p class="strip__set ink-2">{% if page.db_id %}{{ page.db_id }} &middot; {% endif %}{{ page.question_set }}</p>
</header>
{% endmacro %}