{% load static %}
{% load i18n %}
{% load mastodon %}
{% load thumb %}
{% load collection %}
{% load bleach_tags %}
<aside class="grid__aside sidebar">
  <section>
    {% if site_intro %}
      <div hx-get="{{ site_intro }}" hx-trigger="load" hx-swap="outerHTML">
        <i class="fa-solid fa-compact-disc fa-spin loading"></i>
      </div>
    {% else %}
      <article>
        {% url 'users:login' as login_url %}
        {% blocktrans %}
        <h3>Welcome 🙋🏻‍♀️ 🙋🏻 🙋🏻‍♂️</h3>
        <p>
          <i class="fa-solid fa-puzzle-piece"></i> &nbsp; {{ site_name }} is committed to creating a free, open, and interconnected space for collecting and reviewing books, movies, music, games, and podcasts. Here, you can document your collections and thoughts, discover new content, and connect with others.
        </p>
        <p>
          <i class="fa-solid fa-globe"></i> &nbsp; The best way to log in to {{ site_name }} is through a Fediverse (a distributed social network, including Mastodon/Pleroma/etc) instance account. If you haven’t registered yet, you can <a href="https://joinmastodon.org/en/servers" target="_blank">choose a Fediverse instance and sign up</a>.
        </p>
        <p>
          <i class="fa-solid fa-envelope"></i> &nbsp; If you’re not ready to join the Fediverse, that’s perfectly fine. You can create an account here using your email address, and link it to the Fediverse whenever you’re ready.
        </p>
        <p>
          <i class="fa-solid fa-circle-question"></i> &nbsp; If you have any questions or suggestions, feel free to contact us via <a href="https://mastodon.social/@neodb">Fediverse</a> or <a href="https://discord.gg/uprvcH8gqD">Discord</a>.
        </p>
        <p>
          <i class="fa-solid fa-door-open"></i> &nbsp; <a href="{{ login_url }}">Click here</a> to register or log in.
        </p>
        {% endblocktrans %}
      </article>
    {% endif %}
  </section>
  <section class="announcement">
    <article>
      <details {% if all_announcements %}class="auto-collapse" open{% endif %}>
        <summary>{% trans "Announcements" %}</summary>
        {% for ann in all_announcements %}
          <div>{{ ann.html }}</div>
        {% empty %}{% trans "nothing so far." %}
        {% endfor %}
      </details>
    </article>
  </section>
  <section>
    <article>
      <details class="auto-collapse" open>
        <summary>{% trans 'Popular Tags' %}</summary>
        <div class="tag-list">
          {% for t in popular_tags %}
            <span>
              <a href="{% url 'catalog:search' %}?tag={{ t|urlencode }}">{{ t }}</a>
            </span>
          {% empty %}
            <div class="empty">{% trans "nothing so far." %}</div>
          {% endfor %}
        </div>
      </details>
    </article>
  </section>
</aside>
