<?php
// list_7 杂志风：第一条大图头条 + 其余小列表
if (!isset($col) || !is_array($col)) { $col = array(); }
if (!isset($list) || !is_array($list)) { $list = array(); }
$lt7_name  = isset($col['name']) ? $col['name'] : '';
$lt7_intro = isset($col['intro']) ? $col['intro'] : '';
$lt7_cover = isset($col['cover']) ? $col['cover'] : '';
$lt7_first = !empty($list) ? $list[0] : null;
$lt7_rest  = !empty($list) ? array_slice($list, 1) : array();
?>
<style>
.yk-list7{padding:20px 15px 40px;}
.yk-list7 .yk-l7-banner{position:relative;border-radius:8px;overflow:hidden;background:#1f2a3d center/cover no-repeat;margin-bottom:26px;padding:58px 30px;color:#fff;text-align:center;}
.yk-list7 .yk-l7-banner::before{content:"";position:absolute;inset:0;background:rgba(12,20,35,.58);}
.yk-list7 .yk-l7-banner-in{position:relative;z-index:1;}
.yk-list7 .yk-l7-crumb{font-size:13px;color:#999;margin-bottom:12px;}
.yk-list7 .yk-l7-banner .yk-l7-crumb{color:rgba(255,255,255,.8);}
.yk-list7 .yk-l7-crumb a{color:inherit;}
.yk-list7 .yk-l7-crumb a:hover{color:var(--yk-accent,#e63946);}
.yk-list7 .yk-l7-title{font-size:28px;font-weight:700;margin-bottom:10px;}
.yk-list7 .yk-l7-intro{font-size:14px;color:#777;max-width:760px;}
.yk-list7 .yk-l7-banner .yk-l7-intro{color:rgba(255,255,255,.85);margin:0 auto;}
.yk-list7 .yk-l7-head{background:#fff;border-radius:8px;padding:25px 30px;margin-bottom:26px;box-shadow:0 1px 4px rgba(0,0,0,.05);}
.yk-list7 .yk-l7-hero{position:relative;border-radius:10px;overflow:hidden;margin-bottom:26px;box-shadow:0 4px 16px rgba(0,0,0,.12);}
.yk-list7 .yk-l7-hero-img{display:block;height:420px;overflow:hidden;background:#e9ecef;}
.yk-list7 .yk-l7-hero-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.yk-list7 .yk-l7-hero:hover .yk-l7-hero-img img{transform:scale(1.04);}
.yk-list7 .yk-l7-ph{width:100%;height:100%;background:linear-gradient(130deg,#13294b 0%,#2b5d8a 55%,#4f9ec4 100%);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);font-size:14px;letter-spacing:4px;}
.yk-list7 .yk-l7-hero-cap{position:absolute;left:0;right:0;bottom:0;padding:70px 34px 26px;background:linear-gradient(transparent,rgba(0,0,0,.72));color:#fff;}
.yk-list7 .yk-l7-hero-tt{display:block;color:#fff;font-size:24px;font-weight:700;line-height:1.5;}
.yk-list7 .yk-l7-hero-tt:hover{color:#ffd9de;}
.yk-list7 .yk-l7-hero-desc{font-size:13px;color:rgba(255,255,255,.85);margin-top:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.yk-list7 .yk-l7-hero-meta{font-size:12px;color:rgba(255,255,255,.7);margin-top:10px;display:flex;gap:16px;}
.yk-list7 .yk-l7-top{display:inline-block;background:var(--yk-accent,#e63946);color:#fff;font-size:12px;padding:1px 8px;border-radius:3px;margin-right:8px;vertical-align:2px;}
.yk-list7 .yk-l7-item{display:flex;gap:18px;background:#fff;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.05);padding:16px 20px;margin-bottom:14px;align-items:center;}
.yk-list7 .yk-l7-thumb{flex:none;width:150px;height:100px;border-radius:6px;overflow:hidden;background:#e9ecef;}
.yk-list7 .yk-l7-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s;}
.yk-list7 .yk-l7-item:hover .yk-l7-thumb img{transform:scale(1.06);}
.yk-list7 .yk-l7-ph2{width:100%;height:100%;background:linear-gradient(135deg,#31456b 0%,#56749f 100%);}
.yk-list7 .yk-l7-body{flex:1;min-width:0;}
.yk-list7 .yk-l7-tt{font-size:16px;font-weight:700;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.yk-list7 .yk-l7-tt:hover{color:var(--yk-accent,#e63946);}
.yk-list7 .yk-l7-desc{color:#777;font-size:13px;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.yk-list7 .yk-l7-meta{font-size:12px;color:#999;margin-top:8px;display:flex;gap:16px;}
.yk-list7 .yk-l7-empty{background:#fff;border-radius:8px;text-align:center;color:#999;padding:70px 0;font-size:14px;}
@media (max-width:1199px){
  .yk-list7 .yk-l7-hero-img{height:330px;}
  .yk-list7 .yk-l7-title{font-size:24px;}
}
@media (max-width:767px){
  .yk-list7 .yk-l7-hero-img{height:200px;}
  .yk-list7 .yk-l7-hero-cap{padding:50px 18px 16px;}
  .yk-list7 .yk-l7-hero-tt{font-size:17px;}
  .yk-list7 .yk-l7-hero-desc{display:none;}
  .yk-list7 .yk-l7-thumb{width:110px;height:76px;}
  .yk-list7 .yk-l7-tt{font-size:15px;white-space:normal;}
  .yk-list7 .yk-l7-banner{padding:38px 18px;}
  .yk-list7 .yk-l7-title{font-size:20px;}
}
</style>
<div class="yk-wrap yk-list7">
  <?php if ($lt7_cover !== '') { ?>
  <div class="yk-l7-banner" style="background-image:url('<?php echo e($lt7_cover); ?>')">
    <div class="yk-l7-banner-in">
      <div class="yk-l7-crumb"><a href="<?php echo e(url_home()); ?>">首页</a> &gt; <span><?php echo e($lt7_name); ?></span></div>
      <div class="yk-l7-title"><?php echo e($lt7_name); ?></div>
      <?php if ($lt7_intro !== '') { ?><div class="yk-l7-intro"><?php echo e($lt7_intro); ?></div><?php } ?>
    </div>
  </div>
  <?php } else { ?>
  <div class="yk-l7-head">
    <div class="yk-l7-crumb"><a href="<?php echo e(url_home()); ?>">首页</a> &gt; <span><?php echo e($lt7_name); ?></span></div>
    <div class="yk-l7-title"><?php echo e($lt7_name); ?></div>
    <?php if ($lt7_intro !== '') { ?><div class="yk-l7-intro"><?php echo e($lt7_intro); ?></div><?php } ?>
  </div>
  <?php } ?>
  <?php if (is_array($lt7_first)) {
    $lt7_ft   = isset($lt7_first['title']) ? $lt7_first['title'] : '';
    $lt7_fu   = isset($lt7_first['url']) ? $lt7_first['url'] : '#';
    $lt7_fimg = isset($lt7_first['thumb']) ? $lt7_first['thumb'] : '';
    $lt7_fd   = isset($lt7_first['desc']) ? $lt7_first['desc'] : '';
    $lt7_ftm  = isset($lt7_first['add_time']) ? fdate($lt7_first['add_time'], 'Y-m-d') : '';
    $lt7_fv   = isset($lt7_first['views']) ? (int)$lt7_first['views'] : 0;
  ?>
  <div class="yk-l7-hero">
    <a class="yk-l7-hero-img" href="<?php echo e($lt7_fu); ?>">
      <?php if ($lt7_fimg !== '') { ?><img src="<?php echo e($lt7_fimg); ?>" alt="<?php echo e($lt7_ft); ?>"><?php } else { ?><div class="yk-l7-ph">炎酷CMS</div><?php } ?>
    </a>
    <div class="yk-l7-hero-cap">
      <a class="yk-l7-hero-tt" href="<?php echo e($lt7_fu); ?>"><?php if (!empty($lt7_first['is_top'])) { ?><span class="yk-l7-top">置顶</span><?php } echo e($lt7_ft); ?></a>
      <?php if ($lt7_fd !== '') { ?><div class="yk-l7-hero-desc"><?php echo e($lt7_fd); ?></div><?php } ?>
      <div class="yk-l7-hero-meta"><span><?php echo e($lt7_ftm); ?></span><span>阅读 <?php echo $lt7_fv; ?></span></div>
    </div>
  </div>
  <?php } ?>
  <?php if (!empty($lt7_rest)) { ?>
    <?php foreach ($lt7_rest as $lt7_it) {
      $lt7_t   = isset($lt7_it['title']) ? $lt7_it['title'] : '';
      $lt7_u   = isset($lt7_it['url']) ? $lt7_it['url'] : '#';
      $lt7_img = isset($lt7_it['thumb']) ? $lt7_it['thumb'] : '';
      $lt7_d   = isset($lt7_it['desc']) ? $lt7_it['desc'] : '';
      $lt7_tm  = isset($lt7_it['add_time']) ? fdate($lt7_it['add_time'], 'Y-m-d') : '';
      $lt7_v   = isset($lt7_it['views']) ? (int)$lt7_it['views'] : 0;
    ?>
    <div class="yk-l7-item">
      <a class="yk-l7-thumb" href="<?php echo e($lt7_u); ?>">
        <?php if ($lt7_img !== '') { ?><img src="<?php echo e($lt7_img); ?>" alt="<?php echo e($lt7_t); ?>"><?php } else { ?><div class="yk-l7-ph2"></div><?php } ?>
      </a>
      <div class="yk-l7-body">
        <a class="yk-l7-tt" href="<?php echo e($lt7_u); ?>"><?php if (!empty($lt7_it['is_top'])) { ?><span class="yk-l7-top">置顶</span><?php } echo e($lt7_t); ?></a>
        <?php if ($lt7_d !== '') { ?><div class="yk-l7-desc"><?php echo e($lt7_d); ?></div><?php } ?>
        <div class="yk-l7-meta"><span><?php echo e($lt7_tm); ?></span><span>阅读 <?php echo $lt7_v; ?></span></div>
      </div>
    </div>
    <?php } ?>
  <?php } elseif (!is_array($lt7_first)) { ?>
    <div class="yk-l7-empty">暂无内容</div>
  <?php } ?>
  <?php echo isset($pager) ? $pager : ''; ?>
</div>
