{% extends "base.html" %}

{% block head %}
<link rel="stylesheet" href="/css/index.css">
{% endblock %}

{% block body %}
<header class="page-header">
  <img src="/tildes-statistics.png" alt="Tildes Statistics Logo">
  <h1>Tildes Statistics</h1>
</header>

<main class="page-main">
  <h2>General</h2>

  <p>
    There are currently an estimated
    <span class="underline">{{ user_count }}</span>
    registered users on Tildes.
  </p>

  <img class="chart" src="/charts/user-count.svg" alt="User Count Chart">

  <table>
    <thead>
      <tr>
        <th>Group</th>
        <th>Subscribers</th>
        <th>Description</th>
      </tr>
    </thead>

    <tbody>
      {% for group in groups %}
      <tr>
        <td>
          <a href="{{ base_url }}/{{ group.name }}">{{ group.name }}</a>
        </td>
        <td>{{ group.subscribers }}</td>
        <td>
          {% if let Some(description) = group.description %}
          {{ description }}
          {% endif %}
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</main>

<footer class="page-footer">
  <p>
    Last generated on
    <time class="underline" datetime="{{ today }}">{{- today -}}</time>.
  </p>

  <p>
    &copy; Code
    <a href="https://git.bauke.xyz/Bauke/tildes-statistics">AGPL-3.0-or-later</a>,
    charts & data
    <a href="https://creativecommons.org/licenses/by-nc/4.0/">CC BY-NC 4.0</a>.
  </p>

  <p class="bold">
    Consider joining <a href="{{ base_url }}">Tildes</a>, a non-profit
    community site driven by its users' interests.
  </p>
</footer>
{% endblock %}