it" class="btn-fill">
        <span class="htmx-hide-on-request">create bouncer</span>
        <span class="htmx-indicator">creating...</span>
      </button>
    </form>
  </div>
  <div id="bouncer-result"></div>
  {% else %}
  {% for bouncer in bouncers %}
  <a href="/bouncers/{{ bouncer.name }}" style="text-decoration: none; color: inherit;">
    <div class="card">
      <h2>{{ bouncer.name }}</h2>
      <p>{{ bouncer.hostname }} -- {% if bouncer.ready %}<span style="color: var(--g);">ready</span>{% else %}<span style="color: #E08080;">not ready</span>{% endif %}</p>
    </div>
  </a>
  {% endfor %}
  {% endif %}
</div>
{% endblock %}