{% extends "base.html" %}
{% block title %}{{ spec.label }}{% endblock %}
{% block content %}
{% set hue = groups.index(spec.group) % 6 if spec.group in groups else 0 %}
<div class="page" style="--hue: var(--hue-{{ hue }})">
  <div class="bar">
    <div class="head">
      <div class="eyebrow"><span class="dot"></span>{{ spec.group }}</div>
      <h1 class="title">{{ spec.label }}</h1>
    </div>
    <div class="actions">
      <form method="get" class="filters">
        {% if spec.searchable or spec.exact_searchable %}
        <input name="search" value="{{ search or '' }}" placeholder="Search">
        {% endif %}
        {% for name in spec.filters %}
        <input name="{{ name }}" value="{{ filters.get(name, '') }}" placeholder="{{ name }}">
        {% endfor %}
        <button class="btn" type="submit">Filter</button>
      </form>
      {% if spec.renders("export") %}
      <a class="btn" href="{{ page_url }}/export">Export CSV</a>
      {% endif %}
    </div>
  </div>
  {% if spec.exact_searchable %}
  <div class="label note">{{ spec.exact_searchable | join(", ") }} match in full only</div>
  {% endif %}
  <div class="pad">{% include "_table.html" %}</div>
</div>
{% endblock %}