{layout layout}

<section class="home-hero">
  <div class="container home-hero__inner">
    <h1 class="home-hero__title">{$site.name|default=aucms}</h1>
    <p class="home-hero__desc">{if !empty($site.description)}{$site.description}{else}{lang home.hero_desc}{/if}</p>
  </div>
</section>

<div class="container home-layout">
  <div class="home-main">

    {if !empty($lead)}
    <article class="lead">
      <a class="lead__thumb" href="{$lead.url}">
        {if !empty($lead.thumb)}
        <img src="{$lead.thumb|thumb=640}" alt="{$lead.title}" loading="eager">
        {else}
        <span class="lead__thumb-ph">aucms</span>
        {/if}
      </a>
      <div class="lead__body">
        <span class="lead__badge">{lang home.lead}</span>
        <h2 class="lead__title"><a href="{$lead.url}">{$lead.title}</a></h2>
        {if !empty($lead.subtitle)}<p class="lead__subtitle">{$lead.subtitle|limit=60}</p>{/if}
        <p class="lead__desc">{$lead.description|limit=120}</p>
        <div class="lead__meta">
          <span>{$lead.created_at|date=Y-m-d}</span>
          <span>{$lead.views|default=0} {lang common.views_unit}</span>
          {if !empty($lead.tags_array)}<span class="lead__tag">{$lead.tags_array[0]}</span>{/if}
        </div>
      </div>
    </article>
    {/if}

    {if !empty($feed)}
    <section class="feed">
      <div class="section__head">
        <h2 class="section__title">{lang home.feed_title}</h2>
        <a class="section__more" href="{$entry_prefix}/search">{lang common.more} ›</a>
      </div>
      <ul class="feed__list">
        {loop $feed as $item}
        <li class="feed-item">
          <a class="feed-item__thumb" href="{$item.url}">
            {if !empty($item.thumb)}
            <img src="{$item.thumb|thumb=200}" alt="{$item.title}" loading="lazy">
            {else}
            <span class="feed-item__thumb-ph">A</span>
            {/if}
          </a>
          <div class="feed-item__body">
            <h3 class="feed-item__title"><a href="{$item.url}">{$item.title}</a></h3>
            <p class="feed-item__desc">{$item.description|limit=90}</p>
            <div class="feed-item__meta">
              <span>{$item.created_at|date=Y-m-d}</span>
              <span>{$item.views|default=0} {lang common.views_unit}</span>
              {if !empty($item.tags_array)}<span class="feed-item__tag">{$item.tags_array[0]}</span>{/if}
            </div>
          </div>
        </li>
        {/loop}
      </ul>
      {if !empty($pager)}{include common/pager}{/if}
    </section>
    {/if}

    {if empty($lead) && empty($feed)}
    <div class="empty-state">
      <h3 class="empty-state__title">{lang home.no_content}</h3>
      <p>Once an administrator publishes the first piece of content，the latest articles will show up here。</p>
    </div>
    {/if}

    {if !empty($models)}
    <section class="channels">
      <div class="section__head">
        <h2 class="section__title">{lang home.channels_title}</h2>
      </div>
      <div class="channel-grid">
        {loop $models as $model}
        <div class="channel">
          <h3 class="channel__title">{$model.title}</h3>
          <p class="channel__desc">{$model.description}</p>
          <div class="channel__links">
            {loop $nodes as $tn}
            {if $tn.model_id == $model.id}
            <a class="channel__link" href="{$tn.url}">{$tn.name}</a>
            {/if}
            {/loop}
          </div>
        </div>
        {/loop}
      </div>
    </section>
    {/if}

    {if !empty($blocks)}
    {loop $blocks as $block}{$block|raw}{/loop}
    {/if}
  </div>

  <aside class="home-side">
    {if !empty($hot)}
    <section class="side-card">
      <h3 class="side-card__title">{lang home.sidebar_hot}</h3>
      <ol class="hot-list">
        {loop $hot as $h}
        <li class="hot-item">
          <span class="hot-item__no" aria-hidden="true"></span>
          <a class="hot-item__title" href="{$h.url}">{$h.title|limit=26}</a>
          <span class="hot-item__views">{$h.views|default=0}</span>
        </li>
        {/loop}
      </ol>
    </section>
    {/if}

    {if !empty($nodes)}
    <section class="side-card">
      <h3 class="side-card__title">{lang home.sidebar_nav}</h3>
      <ul class="side-nav">
        {loop $nodes as $i => $nav}
        {if $i < 10}
        <li><a href="{$nav.url}">{$nav.name}</a></li>
        {/if}
        {/loop}
      </ul>
    </section>
    {/if}

    {if !empty($tags)}
    <section class="side-card">
      <h3 class="side-card__title">{lang home.sidebar_tags}</h3>
      <div class="side-tags">
        {loop $tags as $t => $c}
        <a class="side-tag" href="{$entry_prefix}/tag/{$t}">#{$t}</a>
        {/loop}
      </div>
    </section>
    {/if}
  </aside>
</div>