<article class="board-panel" aria-labelledby="board-{{ board.slug }}-title">
    <div class="board-panel__accent" aria-hidden="true"></div>
    <div class="board-panel__inner">
        <div class="board-panel__brand">
            <a href="/board/{{ board.slug }}" class="board-panel__icon-link" tabindex="-1" aria-hidden="true">
                <span class="board-panel__icon board-icon" aria-hidden="true">{{ board.icon_svg|raw }}</span>
            </a>
        </div>
        <div class="board-panel__content">
            <header class="board-panel__header">
                <p class="board-panel__eyebrow">{{ trans('home.title') }}</p>
                <h2 id="board-{{ board.slug }}-title" class="board-panel__title">
                    <a href="/board/{{ board.slug }}" class="board-panel__title-link">{{ board.name }}</a>
                    {% if board.unread_count is defined and board.unread_count > 0 %}
                        <span class="board-unread-badge" title="{{ board.unread_count == 1 ? trans('home.unread_topic', { count: board.unread_count }) : trans('home.unread_topics', { count: board.unread_count }) }}">{{ board.unread_count }}</span>
                    {% endif %}
                    {% if board.acl_topic|default('member') in ['mod', 'admin'] %}
                        <span class="badge badge-muted">{{ trans('home.staff_topics') }}</span>
                    {% endif %}
                    {% if board.acl_read|default('guest') in ['mod', 'admin'] %}
                        <span class="badge badge-muted">{{ trans('home.staff_read') }}</span>
                    {% endif %}
                </h2>
                {% if board.description %}
                    <p class="board-panel__description">{{ board.description }}</p>
                {% endif %}
            </header>

            <dl class="board-panel__stats">
                <div class="board-panel__stat">
                    <dt class="board-panel__stat-label">{{ trans('home.topics') }}</dt>
                    <dd class="board-panel__stat-value">{{ board.topic_count|default(0) }}</dd>
                </div>
                <div class="board-panel__stat">
                    <dt class="board-panel__stat-label">{{ trans('home.posts') }}</dt>
                    <dd class="board-panel__stat-value">{{ board.post_count|default(0) }}</dd>
                </div>
                <div class="board-panel__stat board-panel__stat--activity">
                    <dt class="board-panel__stat-label">{{ trans('home.last_activity') }}</dt>
                    <dd class="board-panel__stat-value board-panel__stat-value--activity">
                        {% if board.last_activity_at %}
                            <time datetime="{{ board.last_activity_at }}">{{ board.last_activity_at|format_datetime }}</time>
                        {% else %}
                            <span class="muted">{{ trans('home.no_posts_yet') }}</span>
                        {% endif %}
                    </dd>
                </div>
            </dl>

            {% if board.recent_topics is defined and board.recent_topics is not empty %}
                <ul class="board-panel__topics" role="list">
                    {% for topic in board.recent_topics %}
                        <li class="board-panel__topic">
                            <a href="/topic/{{ topic.id }}" class="board-panel__topic-link{% if topic.is_unread is defined and topic.is_unread %} topic-unread-link{% endif %}">
                                {% if topic.is_unread is defined and topic.is_unread %}<span class="badge badge-unread" title="{{ trans('common.new_posts') }}">{{ trans('common.new') }}</span>{% endif %}
                                {% if topic.is_pinned %}<span class="badge">{{ trans('common.pinned') }}</span>{% endif %}
                                <span class="board-panel__topic-title">{{ topic.title }}</span>
                            </a>
                            <span class="board-panel__topic-meta muted">
                                {{ topic.post_count }} {{ topic.post_count == 1 ? trans('common.post') : trans('common.posts') }}
                                · <time datetime="{{ topic.last_post_at }}">{{ topic.last_post_at|format_datetime }}</time>
                            </span>
                        </li>
                    {% endfor %}
                </ul>
            {% else %}
                <p class="board-panel__empty muted">{{ trans('home.no_topics_yet') }}</p>
            {% endif %}

            <footer class="board-panel__footer">
                <a class="board-panel__view-all" href="/board/{{ board.slug }}">
                    {{ trans('home.view_all_in', { board: board.name }) }}
                    {% include 'partials/icon.twig' with { name: 'chevron-right' } %}
                </a>
            </footer>
        </div>
    </div>
</article>