{{include "header.html"}}
{{include "nav.html"}}

<main class="main">
    {{if .Type}}
    {{if eq .Type "home"}}
    <!-- 首页轮播 -->
    {{$slides := HomeSlides}}
    {{if $slides}}
    <section class="hero-slider">
        <div class="container">
            <div class="slider-wrapper">
                {{range $slides}}
                <div class="slide">
                    {{if .Img}}<img src="{{.Img}}" alt="{{.Title}}" loading="lazy">{{end}}
                    <div class="slide-content">
                        <h2>{{.Title}}</h2>
                        {{if .SubTitle}}<p>{{.SubTitle}}</p>{{end}}
                        {{if .URL}}<a href="{{.URL}}" class="btn btn-primary">查看详情</a>{{end}}
                    </div>
                </div>
                {{end}}
            </div>
        </div>
    </section>
    {{end}}
    {{end}}
    {{end}}

    <div class="container">
        <!-- 页面标题 -->
        <div class="page-header">
            {{if .Type}}
            {{if eq .Type "home"}}
            <h1 class="page-title">最新文章</h1>
            {{else if eq .Type "category"}}
            {{if .CurrentColumn}}<h1 class="page-title">{{.CurrentColumn.Name}}</h1>{{end}}
            {{if .Single}}<p class="page-desc">{{.Single.Description}}</p>{{end}}
            {{else if eq .Type "search"}}
            <h1 class="page-title">搜索结果</h1>
            {{if .Request}}<p class="page-desc">关键词: {{.Request.Query.key}}</p>{{end}}
            {{else if eq .Type "tag"}}
            <h1 class="page-title">标签聚合</h1>
            {{end}}
            {{end}}
        </div>

        <!-- 瀑布流网格 -->
        {{if .List}}
        <div class="masonry-grid">
            {{range .List}}
            {{$hasImg := and .Img (ne .Img "")}}
            {{$cardClass := "masonry-card"}}
            {{if $hasImg}}{{$cardClass = "masonry-card card-medium"}}{{end}}
            
            <article class="{{$cardClass}}">
                {{if $hasImg}}
                <a href="{{.URL}}" class="card-image">
                    <img src="{{.Img}}" alt="{{.Title}}" loading="lazy">
                </a>
                {{end}}
                
                <div class="card-content">
                    {{if and .ColumnName (not $hasImg)}}
                    <span class="card-category">{{.ColumnName}}</span>
                    {{end}}
                    
                    <h2 class="card-title">
                        <a href="{{.URL}}">{{.Title}}</a>
                    </h2>
                    
                    {{if .Description}}
                    <p class="card-desc">{{.Description}}</p>
                    {{end}}
                    
                    <div class="card-meta">
                        <span class="card-date">{{date "2006-01-02" .CreatedAt}}</span>
                        <span class="card-views">{{.Views}} 阅读</span>
                    </div>
                    
                    {{if .Tags}}
                    <div class="card-tags">
                        {{range .Tags}}
                        <a href="{{.URL}}" class="tag">{{.Name}}</a>
                        {{end}}
                    </div>
                    {{end}}
                </div>
            </article>
            {{end}}
        </div>
        
        <!-- 分页 -->
        {{if .Pager}}
        {{if .Pager.Enabled}}
        <nav class="pagination">
            {{if .Pager.HasPrev}}
            <a href="{{.Pager.PrevURL}}" class="page-link">&larr; 上一页</a>
            {{else}}
            <span class="page-link disabled">&larr; 上一页</span>
            {{end}}
            
            <span class="page-info">{{.Pager.Current}} / {{.Pager.TotalPages}}</span>
            
            {{if .Pager.HasNext}}
            <a href="{{.Pager.NextURL}}" class="page-link">下一页 &rarr;</a>
            {{else}}
            <span class="page-link disabled">下一页 &rarr;</span>
            {{end}}
        </nav>
        {{end}}
        {{end}}
        
        {{else}}
        <div class="empty-state">
            <p>暂无内容</p>
        </div>
        {{end}}
    </div>
</main>

{{include "footer.html"}}
{{include "js.html"}}