Skip to content

Commit 2b52637

Browse files
jnMetaCodejnMetaCode
committed
feat: book cover page + accurate timeline + real stars
Book: brand-mark seal + serif title + volumes + author block now appears as a proper book cover. Full page in PDF, hero block in web view. Page-break fix removes empty page 2. Landing: timeline corrected to actual GitHub creation dates. Stars updated to current numbers across all repo cards and hero stat. Hero status now reads 'Coding 2018 / AI 2022 / 开源爆发 2026.03'.
1 parent ddca99d commit 2b52637

4 files changed

Lines changed: 138 additions & 14 deletions

File tree

‎book/src/brand-mark.png‎

1.24 MB
Loading

‎book/src/intro.md‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,14 @@
1+
<div class="book-cover" markdown="0">
2+
<div class="cover-eyebrow">THE COMPLETE GUIDE TO AI CODING</div>
3+
<img src="./brand-mark.png" class="cover-mark" alt="AI 不止语 印章" />
4+
<h1 class="cover-title">AI 编程实战<br/><span class="cover-vol">三卷书</span></h1>
5+
<div class="cover-volumes">卷一 · 入门 &nbsp;|&nbsp; 卷二 · 工作流 &nbsp;|&nbsp; 卷三 · 架构 &nbsp;|&nbsp; 别册 · 速查</div>
6+
<hr class="cover-rule" />
7+
<div class="cover-author">「AI 不止语」</div>
8+
<div class="cover-handle">jnMetaCode &nbsp;·&nbsp; aibuzhiyu.com</div>
9+
<div class="cover-meta">v1.0 &nbsp;·&nbsp; 2026 / 05 &nbsp;·&nbsp; CC BY-NC-SA 4.0</div>
10+
</div>
11+
112
# 总序
213

314
> 这套书的最大野心：让你看完之后，再也不用问"这个任务该用哪个 AI 工具"。

‎book/theme/custom.css‎

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -238,6 +238,113 @@ html, body, .page, .content {
238238
.content { padding: 16px 4vw; }
239239
}
240240

241+
/* ══════════════════════════════════════════════════════════════════
242+
封面 / 书脸
243+
══════════════════════════════════════════════════════════════════ */
244+
.book-cover {
245+
text-align: center;
246+
padding: 80px 24px 100px;
247+
margin: -20px 0 60px;
248+
background: linear-gradient(180deg,
249+
var(--aibz-cream-soft) 0%,
250+
var(--aibz-cream-deep) 50%,
251+
var(--aibz-cream-soft) 100%);
252+
border-bottom: 3px double var(--aibz-accent);
253+
position: relative;
254+
}
255+
.book-cover .cover-eyebrow {
256+
font-family: var(--aibz-mono);
257+
font-size: 12px;
258+
letter-spacing: 0.32em;
259+
color: var(--aibz-ink-3);
260+
margin-bottom: 32px;
261+
}
262+
.book-cover .cover-mark {
263+
width: 140px;
264+
height: auto;
265+
margin: 0 auto 24px;
266+
display: block;
267+
filter: drop-shadow(0 4px 12px rgba(140, 60, 20, 0.2));
268+
}
269+
.book-cover .cover-title {
270+
font-family: var(--aibz-serif) !important;
271+
font-weight: 900 !important;
272+
font-size: clamp(2.4rem, 6vw, 3.8rem) !important;
273+
line-height: 1.15 !important;
274+
letter-spacing: -0.02em !important;
275+
color: var(--aibz-ink) !important;
276+
border: none !important;
277+
padding: 0 !important;
278+
margin: 0 0 20px !important;
279+
}
280+
.book-cover .cover-vol {
281+
color: var(--aibz-accent);
282+
font-size: 0.85em;
283+
letter-spacing: 0.4rem;
284+
margin-left: 0.4rem;
285+
}
286+
.book-cover .cover-volumes {
287+
font-family: var(--aibz-serif);
288+
font-size: 1.05rem;
289+
color: var(--aibz-ink-2);
290+
margin: 12px auto 0;
291+
max-width: 720px;
292+
line-height: 1.8;
293+
}
294+
.book-cover .cover-rule {
295+
width: 60px;
296+
margin: 36px auto 28px;
297+
border: none;
298+
border-top: 1px solid var(--aibz-accent);
299+
}
300+
.book-cover .cover-author {
301+
font-family: var(--aibz-serif);
302+
font-size: 1.4rem;
303+
font-weight: 700;
304+
color: var(--aibz-accent);
305+
margin-bottom: 8px;
306+
}
307+
.book-cover .cover-handle {
308+
font-family: var(--aibz-mono);
309+
font-size: 13px;
310+
color: var(--aibz-ink-3);
311+
letter-spacing: 0.06em;
312+
margin-bottom: 28px;
313+
}
314+
.book-cover .cover-meta {
315+
font-family: var(--aibz-mono);
316+
font-size: 11.5px;
317+
color: var(--aibz-ink-3);
318+
letter-spacing: 0.08em;
319+
}
320+
321+
/* 印刷 / PDF：封面占一整页 */
322+
@media print {
323+
.book-cover {
324+
background: #fff !important;
325+
border: none !important;
326+
height: 96vh;
327+
display: flex;
328+
flex-direction: column;
329+
justify-content: center;
330+
align-items: center;
331+
page-break-after: always;
332+
page-break-inside: avoid;
333+
margin: 0 !important;
334+
padding: 40px !important;
335+
box-sizing: border-box;
336+
}
337+
.book-cover > * { page-break-inside: avoid; }
338+
.book-cover .cover-eyebrow { color: #555 !important; }
339+
.book-cover .cover-mark { width: 180px; margin-bottom: 30px; }
340+
.book-cover .cover-title { color: #000 !important; font-size: 4rem !important; }
341+
.book-cover .cover-vol { color: #c2410c !important; }
342+
.book-cover .cover-volumes { color: #333 !important; }
343+
.book-cover .cover-rule { border-top-color: #c2410c !important; }
344+
.book-cover .cover-author { color: #c2410c !important; }
345+
.book-cover .cover-handle, .book-cover .cover-meta { color: #555 !important; }
346+
}
347+
241348
/* ── 顶部品牌"回 landing"按钮 ── */
242349
.menu-title::after {
243350
content: '· aibuzhiyu.com';

‎landing/app.jsx‎

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -203,7 +203,7 @@ function Hero(){
203203
<div className="hero-id">
204204
<span><i className="dot" /> jnMetaCode · 全栈开发者</span>
205205
<span>/ 写作 · 开源 · 教学</span>
206-
<span>/ Coding Since 2018 · Brand 2026</span>
206+
<span>/ Coding 2018 · AI 2022 · 开源爆发 2026.03</span>
207207
</div>
208208
</FadeUp>
209209
<SplitTitle html={'AI <span class="accent">不止</span><br/><span class="stroke">于</span>语。'}/>
@@ -230,7 +230,7 @@ function Hero(){
230230
<div className="stat-label"><span className="k">Repos</span>开源仓库</div>
231231
</FadeUp>
232232
<FadeUp delay={3} className="stat-card">
233-
<div className="stat-num"><CountUp to={10300}/><span className="plus">+</span></div>
233+
<div className="stat-num"><CountUp to={10700}/><span className="plus">+</span></div>
234234
<div className="stat-label"><span className="k">Stars</span>社区累计星标</div>
235235
</FadeUp>
236236
<FadeUp delay={4} className="stat-card">
@@ -352,29 +352,29 @@ const REPOS = [
352352
name: 'agency-agents-zh',
353353
title: '211 专家角色 · 中文版',
354354
desc: '即插即用的 AI 专家角色矩阵 — 覆盖工程/设计/营销/金融 18 个部门，含 46 个中国市场原创智能体（小红书/抖音/微信/飞书/钉钉）。',
355-
star: '9.4k', lang: 'Shell', langColor: 'oklch(0.7 0.12 130)',
355+
star: '9.8k', lang: 'Shell', langColor: 'oklch(0.7 0.12 130)',
356356
flagship: true,
357357
href: 'https://github.com/jnMetaCode/agency-agents-zh'
358358
},
359359
{
360360
name: 'superpowers-zh',
361361
title: 'AI 编程超能力 · 中文增强',
362362
desc: '让 16 款 AI 编程工具真正会干活 — Skills 体系完整汉化 + 6 个原创 skills。',
363-
star: '1.8k', lang: 'Shell', langColor: 'oklch(0.7 0.12 130)',
363+
star: '2.0k', lang: 'Shell', langColor: 'oklch(0.7 0.12 130)',
364364
href: 'https://github.com/jnMetaCode/superpowers-zh'
365365
},
366366
{
367367
name: 'agency-orchestrator',
368368
title: '一句话 → 多 AI 协作',
369369
desc: '一句话调度 211+ 专家角色，几分钟交付完整方案。9 家 LLM / 6 家免费，零代码 YAML。',
370-
star: '634', lang: 'TypeScript', langColor: 'oklch(0.65 0.14 240)',
370+
star: '687', lang: 'TypeScript', langColor: 'oklch(0.65 0.14 240)',
371371
href: 'https://github.com/jnMetaCode/agency-orchestrator'
372372
},
373373
{
374374
name: 'ai-coding-guide',
375375
title: 'AI 编程实战指南',
376376
desc: '66 个 Claude Code 技巧 + 10 款工具最佳实践 + 可复制的配置模板。',
377-
star: '141', lang: 'Markdown', langColor: 'oklch(0.6 0.02 60)',
377+
star: '147', lang: 'Markdown', langColor: 'oklch(0.6 0.02 60)',
378378
href: 'https://github.com/jnMetaCode/ai-coding-guide'
379379
},
380380
{
@@ -616,10 +616,12 @@ function About(){
616616
<div className="about-body">
617617
<h3>把"会用 AI 写代码"做成可复制的事。</h3>
618618
<p>
619-
全栈开发者，AI 与开源实践者。从 2018 年开始写技术内容，2024 年起把重心移到
620-
<strong> AI 编程方法论</strong>这件事上。
621-
做过的产品包含 211 专家角色矩阵、AI Agent 安全中间件、多 LLM 编排器，
622-
累计 GitHub Stars 一万+。
619+
全栈开发者，AI 与开源实践者。
620+
2018 年起在 CSDN / 头条 / 抖音 写技术内容；
621+
2022 年 ChatGPT 出来就开始研究 AI，期间做过几个实验性产品（AI 风水应用等），
622+
<strong>用四年时间踩坑、迭代、收敛方向</strong>，
623+
2026 年初终于把"AI 编程方法论"这件事跑通——
624+
两个月内密集发布的开源矩阵累计 GitHub Stars <strong>一万+</strong>。
623625
</p>
624626
<p>
625627
不卖课、不收徒、不带货。<strong>更愿意把时间花在工具的边界探索上</strong> —
@@ -640,12 +642,16 @@ function About(){
640642
<span className="ev">公众号「<b>AI 不止语</b>」开张，正式启用品牌身份做内容主入口。</span>
641643
</div>
642644
<div className="timeline-row">
643-
<span className="yr">2025</span>
644-
<span className="ev">发布 <b>agency-agents-zh</b>（9.4k ★）、<b>agency-orchestrator</b>、<b>shellward</b>、<b>superpowers-zh</b>；<b>ai-coding-guide</b> 上线，66 个 Claude Code 实操技巧。</span>
645+
<span className="yr">2026 / 3</span>
646+
<span className="ev">两个月内密集发布开源矩阵：<b>agency-agents-zh</b>（9.8k ★）、<b>superpowers-zh</b>（1.9k ★）、<b>agency-orchestrator</b>、<b>shellward</b>、<b>ai-coding-guide</b>。</span>
645647
</div>
646648
<div className="timeline-row">
647-
<span className="yr">2018 — 2025</span>
648-
<span className="ev">CSDN / 头条 / 抖音 持续输出技术内容；全栈开发踩过的坑与工程方法，成为后续 AI 编程方法论的底层素材。</span>
649+
<span className="yr">2022 — 2025</span>
650+
<span className="ev">ChatGPT 公测起持续研究 AI 工具与方法论；做过几个 AI 实验性产品（含 AI 风水应用等），积累踩坑经验，逐步把方向收敛到「AI 编程方法论」。</span>
651+
</div>
652+
<div className="timeline-row">
653+
<span className="yr">2018 — 2022</span>
654+
<span className="ev">全栈开发底子；CSDN / 头条 / 抖音 多平台技术写作；为后续 AI 时代的内容沉淀素材。</span>
649655
</div>
650656
</div>
651657
</div>

0 commit comments

Comments
 (0)