前端极简黑白重设计,并纳入客户端注册、站点设置与后台相关改动
- storefront 全站改为极简黑白配色:直角、细线分隔、卡片 hover 浅底、深色模式(跟随系统+手动切换) - 抽出 storefront/partials/card 复用卡片 - 一并提交此前暂存的客户端注册 API、站点设置、后台页面与测试 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
浪子
@@ -1,99 +1,144 @@
|
||||
@extends('storefront.layout', ['title' => 'Tstore · ' . $package->name])
|
||||
@extends('storefront.layout', ['title' => (config('app.name', 'Tstore')) . ' · ' . $package->name])
|
||||
|
||||
@php
|
||||
$typeLabel = $package->type === 'plugin' ? '插件' : '主题';
|
||||
$listRoute = $package->type === 'plugin' ? 'storefront.plugins' : 'storefront.themes';
|
||||
$latestVersion = collect($detail['versions'])->firstWhere('is_latest', true)
|
||||
?: collect($detail['versions'])->firstWhere('is_stable', true)
|
||||
?: ($detail['versions'][0] ?? null);
|
||||
@endphp
|
||||
|
||||
@section('hero')
|
||||
<div class="hero-grid">
|
||||
<div class="hero-card">
|
||||
<h1>{{ $detail['name'] }}</h1>
|
||||
<p>{{ $detail['summary'] ?: '暂无摘要' }}</p>
|
||||
<div class="hero-meta">
|
||||
<div class="hero-stat"><strong>{{ $detail['type'] }}</strong><span>类型</span></div>
|
||||
<div class="hero-stat"><strong>{{ $detail['download_count'] }}</strong><span>累计下载</span></div>
|
||||
<div class="hero-stat"><strong>{{ count($detail['versions']) }}</strong><span>版本数</span></div>
|
||||
<div class="hero-stat"><strong>{{ count($detail['categories']) }}</strong><span>分类</span></div>
|
||||
<section class="hero">
|
||||
<div class="container">
|
||||
<span class="eyebrow">{{ $typeLabel }}</span>
|
||||
<div class="detail-head" style="margin-top:16px">
|
||||
@if($detail['icon_url'])
|
||||
<img class="detail-icon" src="{{ $detail['icon_url'] }}" alt="{{ $detail['name'] }}">
|
||||
@else
|
||||
<div class="detail-icon detail-placeholder">{{ $package->type === 'plugin' ? 'P' : 'T' }}</div>
|
||||
@endif
|
||||
<div>
|
||||
<h1 class="headline" style="margin:0;font-size:30px">{{ $detail['name'] }}</h1>
|
||||
<p class="lede" style="margin-top:10px">{{ $detail['summary'] ?: '这个' . $typeLabel . '当前还没有摘要,详情页会继续保留版本、兼容性和截图信息。' }}</p>
|
||||
<div class="tags">
|
||||
@foreach($package->categories as $category)
|
||||
<span class="tag">{{ $category->name }}</span>
|
||||
@endforeach
|
||||
@if($detail['is_featured'])
|
||||
<span class="tag solid">推荐</span>
|
||||
@endif
|
||||
<span class="tag">{{ $detail['author'] ?: '未知作者' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-actions">
|
||||
<a class="btn ghost" href="{{ route($listRoute) }}">返回{{ $typeLabel }}目录</a>
|
||||
@if($detail['homepage'])
|
||||
<a class="btn" href="{{ $detail['homepage'] }}" target="_blank" rel="noreferrer">访问主页</a>
|
||||
@endif
|
||||
</div>
|
||||
<div class="stats">
|
||||
<div class="stat"><strong>{{ strtoupper($detail['type']) }}</strong><span>扩展类型</span></div>
|
||||
<div class="stat"><strong>{{ $detail['download_count'] }}</strong><span>累计下载</span></div>
|
||||
<div class="stat"><strong>{{ count($detail['versions']) }}</strong><span>版本记录</span></div>
|
||||
<div class="stat"><strong>{{ $latestVersion['version'] ?? '-' }}</strong><span>当前主版本</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-card">
|
||||
<h3 style="margin:0 0 10px;font-size:20px">说明</h3>
|
||||
<p>这是前台展示页，只展示扩展信息、版本兼容性和截图，不直接暴露下载地址。需要维护请进入后台。</p>
|
||||
<div class="card-actions" style="margin-top:18px">
|
||||
<a class="btn secondary" href="{{ route('webadmin.login') }}">后台登录</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="detail-grid">
|
||||
<div class="detail-card">
|
||||
<h3>扩展说明</h3>
|
||||
<div class="muted">作者：{{ $detail['author'] ?: '未知作者' }}</div>
|
||||
<div class="muted">主页：{{ $detail['homepage'] ?: '未提供' }}</div>
|
||||
<div class="tags">
|
||||
@foreach($package->categories as $category)
|
||||
<span class="chip">{{ $category->name }}</span>
|
||||
@endforeach
|
||||
</div>
|
||||
<div style="margin-top:16px;white-space:pre-wrap">{{ $detail['description'] ?: '暂无详细描述。' }}</div>
|
||||
</div>
|
||||
|
||||
<div class="detail-card">
|
||||
<h3>版本信息</h3>
|
||||
<div class="version-list">
|
||||
@forelse($detail['versions'] as $version)
|
||||
<div class="version">
|
||||
<strong>v{{ $version['version'] }}</strong>
|
||||
<div class="muted">{{ $version['is_latest'] ? '最新版本' : '历史版本' }} · {{ $version['is_stable'] ? '稳定版' : '预发布' }}</div>
|
||||
<div class="muted">Typecho {{ $version['compatibility']['typecho_min'] ?: '-' }} ~ {{ $version['compatibility']['typecho_max'] ?: '-' }}</div>
|
||||
<div class="muted">PHP {{ $version['compatibility']['php_min'] ?: '-' }} ~ {{ $version['compatibility']['php_max'] ?: '-' }}</div>
|
||||
@if(!empty($version['changelog']))
|
||||
<div style="margin-top:8px">{{ $version['changelog'] }}</div>
|
||||
@php
|
||||
$screenshots = $detail['screenshots'];
|
||||
$featuredScreenshot = $screenshots[0] ?? null;
|
||||
$secondaryScreenshots = array_slice($screenshots, 1);
|
||||
@endphp
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="detail-layout">
|
||||
<div class="stack">
|
||||
<article class="info-card">
|
||||
<span class="section-kicker">Preview</span>
|
||||
<h3>预览截图</h3>
|
||||
@if($featuredScreenshot)
|
||||
<div class="shots">
|
||||
<figure class="shot-feature">
|
||||
<img src="{{ $featuredScreenshot['url'] }}" alt="{{ $featuredScreenshot['caption'] ?: $detail['name'] }}">
|
||||
<figcaption>
|
||||
<strong>{{ $featuredScreenshot['caption'] ?: $detail['name'] . ' 主预览图' }}</strong>
|
||||
<span>第一张截图作为主视觉展示,后台可继续追加更多截图并调整排序。</span>
|
||||
</figcaption>
|
||||
</figure>
|
||||
@if(count($secondaryScreenshots))
|
||||
<div class="shot-grid">
|
||||
@foreach($secondaryScreenshots as $shot)
|
||||
<figure class="shot-card">
|
||||
<img src="{{ $shot['url'] }}" alt="{{ $shot['caption'] ?: $detail['name'] }}">
|
||||
<figcaption>{{ $shot['caption'] ?: $detail['name'] . ' 截图' }}</figcaption>
|
||||
</figure>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
@else
|
||||
<div class="empty">当前还没有预览截图。</div>
|
||||
@endif
|
||||
</div>
|
||||
@empty
|
||||
<div class="empty">当前没有版本记录。</div>
|
||||
@endforelse
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if(count($detail['screenshots']))
|
||||
<div class="panel section">
|
||||
<div class="section-head">
|
||||
<div>
|
||||
<h2>截图展示</h2>
|
||||
<p>只展示视觉效果，不提供下载入口。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gallery">
|
||||
@foreach($detail['screenshots'] as $shot)
|
||||
<div class="shot">
|
||||
<img src="{{ $shot['url'] }}" alt="{{ $shot['caption'] ?: $detail['name'] }}">
|
||||
<div>{{ $shot['caption'] ?: '扩展截图' }}</div>
|
||||
</article>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="panel section">
|
||||
<div class="section-head">
|
||||
<div>
|
||||
<h2>更多{{ $package->type === 'plugin' ? '插件' : '主题' }}</h2>
|
||||
<p>继续浏览同类内容。</p>
|
||||
<aside class="stack">
|
||||
<article class="info-card">
|
||||
<h3>{{ $typeLabel }}说明</h3>
|
||||
<div class="rich-text">{{ $detail['description'] ?: '当前还没有更详细的介绍。' }}</div>
|
||||
</article>
|
||||
|
||||
<article class="info-card">
|
||||
<h3>资料与兼容性</h3>
|
||||
<div class="info-list">
|
||||
<div class="info-item"><strong>作者与协议</strong><span>{{ $detail['author'] ?: '未知作者' }} · {{ $detail['license'] ?: '未声明 License' }}</span></div>
|
||||
<div class="info-item"><strong>最近更新</strong><span>{{ optional($package->updated_at)->format('Y-m-d H:i') ?: '未记录' }}</span></div>
|
||||
@if($detail['homepage'])
|
||||
<div class="info-item"><strong>主页</strong><a href="{{ $detail['homepage'] }}" target="_blank" rel="noreferrer">{{ $detail['homepage'] }}</a></div>
|
||||
@endif
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="info-card">
|
||||
<h3>版本记录</h3>
|
||||
<div class="version-list">
|
||||
@forelse($detail['versions'] as $version)
|
||||
<div class="version-item">
|
||||
<div class="version-head">
|
||||
<div>
|
||||
<div class="version-title">v{{ $version['version'] }}</div>
|
||||
<div class="version-meta">发布于 {{ $version['published_at'] ? \Illuminate\Support\Carbon::parse($version['published_at'])->format('Y-m-d H:i') : '未标记时间' }}</div>
|
||||
</div>
|
||||
<div class="tags" style="margin-top:0">
|
||||
<span class="tag {{ $version['is_stable'] ? 'solid' : '' }}">{{ $version['is_stable'] ? '稳定版' : '预发布' }}</span>
|
||||
@if($version['is_latest'])
|
||||
<span class="tag">最新</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags">
|
||||
<span class="tag">Typecho {{ $version['compatibility']['typecho_min'] ?: '-' }} ~ {{ $version['compatibility']['typecho_max'] ?: '-' }}</span>
|
||||
<span class="tag">PHP {{ $version['compatibility']['php_min'] ?: '-' }} ~ {{ $version['compatibility']['php_max'] ?: '-' }}</span>
|
||||
@if(!empty($version['compatibility']['php_extensions']))
|
||||
<span class="tag">扩展 {{ collect($version['compatibility']['php_extensions'])->join(', ') }}</span>
|
||||
@endif
|
||||
</div>
|
||||
@if(!empty($version['changelog']))
|
||||
<div class="rich-text" style="margin-top:12px;font-size:14px">{{ $version['changelog'] }}</div>
|
||||
@endif
|
||||
</div>
|
||||
@empty
|
||||
<div class="empty">当前没有版本记录。</div>
|
||||
@endforelse
|
||||
</div>
|
||||
</article>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid">
|
||||
@forelse($related as $item)
|
||||
<div class="card">
|
||||
<div class="title">{{ $item->name }}</div>
|
||||
<div class="muted">{{ $item->summary ?: '暂无摘要' }}</div>
|
||||
<div class="card-actions">
|
||||
<a class="btn secondary" href="{{ route('storefront.show', [$item->type, $item->slug]) }}">查看详情</a>
|
||||
</div>
|
||||
</div>
|
||||
@empty
|
||||
<div class="empty">当前没有更多相关内容。</div>
|
||||
@endforelse
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@endsection
|
||||
|
||||
Reference in New Issue
Block a user