65 lines
3.5 KiB
HTML
65 lines
3.5 KiB
HTML
<div class="page-header">
|
|
<div class="layui-container">
|
|
<div class="layui-row">
|
|
<div class="layui-col-md12">
|
|
<div class="breadcrumb">
|
|
<span class="layui-breadcrumb">
|
|
<a href="{:url('index/index')}"><i class="layui-icon layui-icon-home"></i> 首页</a>
|
|
<a href="{:url('notice/index')}">站点公告</a>
|
|
<a><cite>{$info.title|default=''}</cite></a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="notice-detail">
|
|
<div class="layui-container">
|
|
<div class="layui-row">
|
|
<div class="layui-col-md12">
|
|
<div class="notice-detail-card">
|
|
<div class="notice-detail-head">
|
|
<span class="notice-badge notice-type-{$info.type}">{$info.type_text}</span>
|
|
{eq name='info.is_top' value='1'}<span class="top-flag">置顶</span>{/eq}
|
|
<h1 class="notice-detail-title">{$info.title}</h1>
|
|
<div class="notice-detail-meta">
|
|
<span><i class="layui-icon layui-icon-user"></i> {$info.author|default='官方'}</span>
|
|
<span><i class="layui-icon layui-icon-date"></i> {$info.create_at|substr=0,16}</span>
|
|
<span><i class="layui-icon layui-icon-eye"></i> {$info.view_count|default=0}</span>
|
|
{if condition="$info.start_time > 0 || $info.end_time > 0"}
|
|
<span><i class="layui-icon layui-icon-time"></i>
|
|
{$info.start_time>0?date('Y-m-d',$info.start_time):'长期'} ~
|
|
{$info.end_time>0?date('Y-m-d',$info.end_time):'长期'}
|
|
</span>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
<div class="notice-detail-content">
|
|
{:nl2br(htmlspecialchars($info.content))}
|
|
</div>
|
|
<div class="notice-detail-back">
|
|
<a href="{:url('notice/index')}" class="layui-btn layui-btn-primary"><i class="layui-icon layui-icon-return"></i> 返回公告列表</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.notice-detail-card { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 30px 36px; margin-bottom: 30px; }
|
|
.notice-detail-head { border-bottom: 1px solid #f0f0f0; padding-bottom: 18px; margin-bottom: 22px; }
|
|
.notice-badge { display: inline-block; color: #fff; border-radius: 3px; padding: 2px 10px; font-size: 13px; background: #8c8c8c; }
|
|
.notice-type-1 { background: #1890ff; }
|
|
.notice-type-2 { background: #fa8c16; }
|
|
.notice-type-3 { background: #52c41a; }
|
|
.notice-type-4 { background: #8c8c8c; }
|
|
.top-flag { display: inline-block; color: #d46b08; font-size: 12px; border: 1px solid #ffd591; border-radius: 3px; padding: 1px 8px; margin-left: 6px; }
|
|
.notice-detail-title { font-size: 24px; font-weight: 700; color: #222; margin: 12px 0 14px; line-height: 1.4; }
|
|
.notice-detail-meta { display: flex; flex-wrap: wrap; gap: 18px; color: #999; font-size: 13px; }
|
|
.notice-detail-meta span { display: inline-flex; align-items: center; gap: 3px; }
|
|
.notice-detail-content { font-size: 15px; line-height: 2; color: #444; white-space: pre-wrap; word-break: break-word; }
|
|
.notice-detail-back { margin-top: 30px; }
|
|
</style>
|