{% extends "base.html" %}
{% block content %}
{%- set rows = [] %}
{%- for cat, arts in categories %}{% set _ = rows.append((BBS_AREAS.get(cat|string, 99), cat, arts)) %}{% endfor %}
{%- set ordered = rows|sort(attribute='0') %}
{%- set half = (ordered|length + 1) // 2 %}
<div class="desktop-only">
<pre class="box">┌─ <span class="boxtitle">MESSAGE AREAS</span> ───────────────────────┬──────────────────────────────────────┐</pre>
{%- for i in range(half) %}
{%- set a = ordered[i] %}
<pre class="box">│ <span class="key">[<b>{{ a[0] }}</b>]</span> <a data-key="{{ a[0] }}" href="{{ SITEURL }}/{{ a[1].url }}"><span class="area">{{ "%-9s"|format(a[1]|string) }}</span></a>                     <span class="count">{{ "%3d"|format(a[2]|length) }}</span> │ {% if ordered|length > i + half %}{% set b = ordered[i + half] %}<span class="key">[<b>{{ b[0] }}</b>]</span> <a data-key="{{ b[0] }}" href="{{ SITEURL }}/{{ b[1].url }}"><span class="area">{{ "%-9s"|format(b[1]|string) }}</span></a>                    <span class="count">{{ "%3d"|format(b[2]|length) }}</span>{% else %}                                    {% endif %} │</pre>
{%- endfor %}
<pre class="box">└───────────────────────────────────────┴──────────────────────────────────────┘</pre>
</div>

<div class="mobile-only">
<pre class="box">┌─ <span class="boxtitle">MESSAGE AREAS</span> ──────────────────────┐</pre>
{%- for a in ordered %}
<pre class="box">│ <span class="key">[<b>{{ "%2d"|format(a[0]) }}</b>]</span> <a data-key="{{ a[0] }}" href="{{ SITEURL }}/{{ a[1].url }}"><span class="area">{{ "%-28s"|format(a[1]|string) }}</span></a><span class="count">{{ "%3d"|format(a[2]|length) }}</span> │</pre>
{%- endfor %}
<pre class="box">└──────────────────────────────────────┘</pre>
</div>

{# GUESTBOOK is commented out of the menu until it is built; the page and its
   mockup stay in the tree. Restoring it means a third column here and
   dropping Status: draft from content/pages/guestbook.md. #}
<div class="desktop-only">
<pre class="box">┌─ <span class="boxtitle">SYSTEM</span> ──────────────────────────────┬──────────────────────────────────────┐</pre>
<pre class="box">│ <a data-key="A" href="{{ SITEURL }}/about.html"><span class="key">[<b>A</b>]</span> <span class="area">ABOUT</span></a>                             │ <a data-key="C" href="{{ SITEURL }}/connect.html"><span class="key">[<b>C</b>]</span> <span class="area">CONNECT</span></a>                          │</pre>
<pre class="box">└───────────────────────────────────────┴──────────────────────────────────────┘</pre>
</div>

<div class="mobile-only">
<pre class="box">┌─ <span class="boxtitle">SYSTEM</span> ─────────────────────────────┐</pre>
<pre class="box">│ <a data-key="A" href="{{ SITEURL }}/about.html"><span class="key">[<b>A</b>]</span> <span class="area">{{ "%-32s"|format("ABOUT") }}</span></a> │</pre>
<pre class="box">│ <a data-key="C" href="{{ SITEURL }}/connect.html"><span class="key">[<b>C</b>]</span> <span class="area">{{ "%-32s"|format("CONNECT") }}</span></a> │</pre>
<pre class="box">└──────────────────────────────────────┘</pre>
</div>

<div class="desktop-only">
<pre class="box">┌─ <span class="boxtitle">LATEST</span> ─────────────────────────────────────────────────────────────────────┐</pre>
{%- set base = BBS_AREAS|length %}
{%- for article in articles_page.object_list %}
{%- set n = base + loop.index %}
<pre class="box">│ <span class="key">[<b>{{ "%2d"|format(n) }}</b>]</span> <span class="date">{{ article.date.strftime('%d %b %y')|lower }}</span> <span class="sect">{{ "%-8s"|format(article.category|string) }}</span> <a data-key="{{ n }}" href="{{ SITEURL }}/{{ article.url }}">{{ "%-52s"|format(article.title|striptags|truncate(52, true, '')) }}</a> │</pre>
{%- endfor %}
<pre class="box">└──────────────────────────────────────────────────────────────────────────────┘</pre>
</div>

<div class="mobile-only">
<pre class="box">┌─ <span class="boxtitle">LATEST</span> ─────────────────────────────┐</pre>
{%- set base = BBS_AREAS|length %}
{%- for article in articles_page.object_list %}
{%- set n = base + loop.index %}
<pre class="box">│ <a data-key="{{ n }}" href="{{ SITEURL }}/{{ article.url }}"><span class="key">[<b>{{ "%2d"|format(n) }}</b>]</span> {{ "%-31s"|format(article.title|striptags|truncate(31, true, '', 0)) }}</a> │</pre>
<pre class="box">│      <span class="date">{{ article.date.strftime('%d %b %y')|lower }}</span> · <span class="sect">{{ "%-8s"|format(article.category|string) }}</span>            │</pre>
{%- endfor %}
<pre class="box">└──────────────────────────────────────┘</pre>
</div>
{% include 'pagination.html' %}
{% endblock %}