{% extends "base.html" %}
{% block content %}

  <div
    style="display: none;"
    hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
    hx-get="{% url 'threshold_irc_stats' %}"
    hx-trigger="load"
    hx-target="#stats"
    hx-swap="outerHTML">
  </div>

  <div
    style="display: none;"
    hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
    hx-get="{% url 'threshold_irc_networks' %}"
    hx-trigger="load"
    hx-target="#networks"
    hx-swap="outerHTML">
  </div>

  <div
    style="display: none;"
    hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
    hx-get="{% url 'threshold_irc_aliases' %}"
    hx-trigger="load"
    hx-target="#aliases"
    hx-swap="outerHTML">
  </div>

  <div
    style="display: none;"
    hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
    hx-get="{% url 'threshold_irc_actions' %}"
    hx-trigger="load"
    hx-target="#actions"
    hx-swap="outerHTML">
  </div>

  <div class="columns">
    <div class="column">
      <div class="box">
        <div id="stats">
        </div>
      </div>
    </div>
    <div class="column">
      <div class="box">
        <div id="networks">
        </div>
      </div>
    </div>
  </div>

  <div class="columns">
    <div class="column">
      <div class="box">
        <div id="aliases">
        </div>
      </div>
    </div>
    <div class="column">
      <div class="box">
        <div id="alerts">
          Alerts here
        </div>
      </div>
    </div>
  </div>

  <div class="columns">
    <div class="column"></div>
    <div class="column is-half">
      <div class="box">
        <div id="actions">
        </div>
      </div>
    </div>
  </div>
  <div id="modals-here">
  </div>
{% endblock %}