{# 继承基础布局模板，确保页面整体结构（如导航、页脚）与项目其他页面一致 #}
{% extends 'share_layout/base.html' %}
{# 加载博客自定义模板标签库，用于后续调用自定义标签（如 load_article_detail） #}
{% load blog_tags %}
{# 定义页面头部区块（对应 base.html 中的 header 块），设置 SEO 与社交分享元信息 #}
{% block header %}
    {# 页面标题：站点名称 + 站点描述 #}
    <title>{{ SITE_NAME }} | {{ SITE_DESCRIPTION }}</title>
    {# SEO 元标签：描述、关键词 #}
    <meta name="description" content="{{ SITE_SEO_DESCRIPTION }}"/>
    <meta name="keywords" content="{{ SITE_KEYWORDS }}"/>
    {# Open Graph 协议元标签（社交平台分享时的预览信息） #}
    <meta property="og:type" content="blog"/>
    <meta property="og:title" content="{{ SITE_NAME }}"/>
    <meta property="og:description" content="{{ SITE_DESCRIPTION }}"/>
    <meta property="og:url" content="{{ SITE_BASE_URL }}"/>
    <meta property="og:site_name" content="{{ SITE_NAME }}"/>
{% endblock %}

{# 定义页面主体内容区块（对应 base.html 中的 content 块） #}
{% block content %}
    {# 页面主容器，用于排版与样式控制 #}
    <div id="primary" class="site-content">
        <div id="content" role="main">
            {# 若存在搜索关键词（query 不为空），则渲染搜索结果头部 #}
            {% if query %}
                <header class="archive-header">
                    {# 若存在推荐搜索词（suggestion 不为空），显示推荐结果与原始搜索链接 #}
                    {% if suggestion %}
                        <h2 class="archive-title">
                            已显示<span style="color: red"> “{{ suggestion }}” </span>的搜索结果。&nbsp;&nbsp;
                            仍然搜索：<a style="text-transform: none;" href="/search/?q={{ query }}&is_suggest=no">{{ query }}</a> <br>
                        </h2>
                    {% else %}
                        <h2 class="archive-title">
                            搜索：<span style="color: red">{{ query }} </span> &nbsp;&nbsp;
                        </h2>
                    {% endif %}
                </header><!-- .archive-header -->
            {% endif %}

            {# 若存在搜索关键词且结果列表不为空，渲染文章列表与分页 #}
            {% if query and page.object_list %}
                {# 循环遍历搜索结果分页中的每篇文章 #}
                {% for article in page.object_list %}
                    {% load_article_detail article.object True user %}
                {% endfor %}

                {# 若存在上一页或下一页，渲染分页导航 #}
                {% if page.has_previous or page.has_next %}
                    <nav id="nav-below" class="navigation" role="navigation">
                        <h3 class="assistive-text">文章导航</h3>
                        {% if page.has_previous %}
                            <div class="nav-previous"><a
                                    href="?q={{ query }}&amp;page={{ page.previous_page_number }}"><span
                                    class="meta-nav">&larr;</span> 早期文章</a></div>
                        {% endif %}
                        {% if page.has_next %}
                            <div class="nav-next"><a href="?q={{ query }}&amp;page={{ page.next_page_number }}">较新文章
                                <span
                                        class="meta-nav">→</span></a>
                            </div>
                        {% endif %}
                    </nav><!-- .navigation -->

                {% endif %}
            {# 若无搜索结果（关键词存在但结果列表为空），渲染无结果提示 #}
            {% else %}
                <header class="archive-header">

                    <h1 class="archive-title">哎呀，关键字：<span>{{ query }}</span>没有找到结果，要不换个词再试试？</h1>
                </header><!-- .archive-header -->
            {% endif %}
        </div><!-- #content -->
    </div><!-- #primary -->
{% endblock %}


{% block sidebar %}
    {% load_sidebar request.user 'i' %}
{% endblock %}


