Explain how to add the official source and develop, package, and install Curios. Use the selected blue-and-white illustration as the README hero and preserve the poster variants and prompts for reference. Validation: documentation links and anchors checked; CLI static starter creation, check, and pack passed; image dimensions and asset links verified.
51 lines
3.0 KiB
HTML
51 lines
3.0 KiB
HTML
<!doctype html>
|
||
<html lang="zh-CN">
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Trove Curios · 海报评审</title>
|
||
<style>
|
||
* { box-sizing: border-box; }
|
||
body { margin: 0; color: #202522; background: #f4f3ee; font: 16px/1.6 system-ui, sans-serif; }
|
||
main { max-width: 1600px; margin: auto; padding: 36px clamp(20px, 4vw, 64px) 64px; }
|
||
header { margin-bottom: 32px; }
|
||
h1 { margin: 0 0 6px; font-size: clamp(24px, 3vw, 36px); letter-spacing: -.04em; }
|
||
p { margin: 0; color: #646b65; }
|
||
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
|
||
figure { margin: 0; min-width: 0; }
|
||
a { color: inherit; text-decoration: none; }
|
||
a:focus-visible { outline: 3px solid #136adc; outline-offset: 6px; }
|
||
img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; background: #fff; border-radius: 6px; }
|
||
figcaption { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin-top: 12px; }
|
||
strong { font-size: 19px; }
|
||
span { color: #646b65; font-size: 14px; }
|
||
footer { margin-top: 36px; color: #646b65; font-size: 14px; }
|
||
footer a { text-decoration: underline; text-underline-offset: 3px; }
|
||
@media (max-width: 760px) { .grid { grid-template-columns: 1fr; } }
|
||
</style>
|
||
<main>
|
||
<header>
|
||
<h1>Trove Curios · 海报方向</h1>
|
||
<p>已采用 A · 蓝白极简作为 README 头图。点击图片查看原图。</p>
|
||
</header>
|
||
<div class="grid">
|
||
<figure>
|
||
<a href="a-swiss-v2.png" target="_blank" rel="noopener"><img src="a-swiss-v2.png" alt="A 蓝白极简:软件源中的工具经蓝色圆形来到桌面" width="1536" height="1024"></a>
|
||
<figcaption><strong>A · 蓝白极简</strong><span>已采用 · README 头图</span></figcaption>
|
||
</figure>
|
||
<figure>
|
||
<a href="b-comic-v2.png" target="_blank" rel="noopener"><img src="b-comic-v2.png" alt="B 漫画分镜:从源到工具再到桌面的三段漫画" width="1536" height="1024"></a>
|
||
<figcaption><strong>B · 漫画分镜</strong><span>动线 · 分镜 · 网点</span></figcaption>
|
||
</figure>
|
||
<figure>
|
||
<a href="c-blueprint-v2.png" target="_blank" rel="noopener"><img src="c-blueprint-v2.png" alt="C 工程蓝图:深蓝背景上的软件源、工具与设备连接" width="1536" height="1024"></a>
|
||
<figcaption><strong>C · 工程蓝图</strong><span>线稿 · 连接 · 深蓝</span></figcaption>
|
||
</figure>
|
||
<figure>
|
||
<a href="d-risograph-v2.png" target="_blank" rel="noopener"><img src="d-risograph-v2.png" alt="D 复古孔版:红绿双色的桌面工具百宝箱" width="1536" height="1024"></a>
|
||
<figcaption><strong>D · 复古孔版</strong><span>纸张 · 双色 · 温暖</span></figcaption>
|
||
</figure>
|
||
</div>
|
||
<footer>1536 × 1024 · PNG · <a href="prompts-v2.json">完整提示词</a> · <a href="../../README.md">README 正文</a></footer>
|
||
</main>
|
||
</html>
|