暖阳导语条（开篇轻量）
+开篇导语：一句话说清本篇讲什么、读者能带走什么，与外标题错开视角。
+品牌叙事开篇卡
+叙事导语占位：这里放两三行品牌故事或情绪铺垫文字，语速放慢、句子放短，让读者先安静下来，再进入正文的说明部分。
+ 按钮文案占位 +情绪寄语开篇条
+· · ·
+一句寄语占位：今天也想对你说
+小注说明占位：寄语来源或氛围说明
+拍立得首图卡
+圆点目录卡
+ + + +阅读指引条
+ + + +标签索引带
+ + + +暖点分隔线
+圆点章节标题
+章节标题占位：正文从这里开始
+章节引导语占位：一句话说明本章内容
+便签小节标题
+小节标题占位
+小节说明占位：这一小节要讲的重点
+居中仪式标题
+章节序号占位
+居中标题占位
+· · ·
+暖章编号标题
++ 01 + 章节标题占位一 +
+章节摘要占位：编号章节的一句摘要
+栏目贴纸标题
+栏目标签占位
+栏目标题占位：贴纸下方的标题行
+呼吸正文段落
+正文段落占位：这里是放松呼吸的正文区域，行距放宽、句子放短。占位文字用来展示段落节奏与留白比例，两到三行为一组，读起来不赶时间。
+正文段落占位：第二段承接第一段的话题继续展开，保持同样的字重与行高，让整页像一杯慢慢降温的热茶，信息清晰但没有压迫感。
+暖点引导段落
+引导短语占位正文占位：开头用一枚浅杏色的高亮短语轻轻拉住视线，后面的文字自然展开，用来说明这一段的重点句式与节奏。
+浅杏底纹强调段
+重点段落占位：需要读者慢下来多看一眼的内容放在这里。浅杏衬底加左侧暖橙竖线，强调而不喊叫，适合放核心观点或安抚性的说明。
+行内代码段落
+说明文字占位：正文中出现配置项或命令时，使用行内代码样式，例如 配置项占位 或 命令占位，保持柔和的可读性。
热茶引语卡
+“
+引用内容占位：一段值得慢慢读的话放在这里，像热茶冒着的一缕气，轻轻落在页面中间。
+—— 引用署名占位
+居中轻引言
+· · ·
+引言文字占位：居中排布的一句轻声话。
+—— 引用出处占位
+暖心提示卡
+提示标签占位
+提示说明占位：温和的信息提示放在这里，例如阅读建议、氛围说明或背景补充，语气保持轻柔。
+温和提醒卡
+注意标签占位
+提醒说明占位：需要读者留意但不必紧张的内容，用虚线暖框表达，提醒而不吓人。
+安心确认卡
+✓确认标题占位
+确认说明占位：已经完成或可以放心的事项写在这里，给读者一个落地的安心感。
+陪伴留声卡
+陪伴小语占位 ♡
+陪伴语句占位：写给此刻正在阅读的人的一句话，承认情绪、给出陪伴，不做评判。
+落款占位 · 留声说明占位
+圆点清单卡
+清单标题占位
+清单条目占位一：短句说明
+清单条目占位二：短句说明
+清单条目占位三：短句说明
+清单条目占位四：短句说明
+暖序步骤列表
+有序清单标题占位
+1列表条目占位一
+2列表条目占位二
+3列表条目占位三
+心愿任务清单
+任务清单标题占位
+✓任务条目占位一（已完成占位）
+✓任务条目占位二（已完成占位）
+任务条目占位三（待完成占位）
+完成度说明占位：示例数字 2 / 3
+词语标签云
+ + + +要点三束卡
+要点一要点标题占位一
+要点说明占位：一句话解释第一个要点。
+要点二要点标题占位二
+要点说明占位：一句话解释第二个要点。
+要点三要点标题占位三
+要点说明占位：一句话解释第三个要点。
+圆角大图卡
+拍立得图文卡
+图注标题占位
+图注说明占位：写一句和图片心情一致的话。
+双图柔和对比卡
+对比占位
+静态视频占位卡
+视频说明占位
+时长占位 · 封面说明占位
+浅杏代码块
+代码说明占位 · 代码块标题占位
+// 说明注释占位
const warmConfig = {
fieldA: "字段占位一",
fieldB: "字段占位二"
};
+ 暖框代码块
+代码标题占位：终端样式说明
+$ 命令占位 --参数占位
> 输出说明占位一
> 输出说明占位二
完成提示占位 ✓
+轻盈指标条
+82%指标名称占位一 · 指标说明占位
+1200+指标名称占位二 · 指标说明占位
+4.8指标名称占位三 · 指标说明占位
+字段数据表
+表格标题占位
+表格说明占位：字段与示例数据的对照
+| 字段占位一 | +字段占位二 | +字段占位三 | +
| 数据占位 01 | +数据占位 02 | +数据占位 03 | +
| 数据占位 04 | +数据占位 05 | +数据占位 06 | +
| 数据占位 07 | +数据占位 08 | +数据占位 09 | +
暖橙进度条组
+进度标题占位
+进度项占位一 · 80%
+进度项占位二 · 60%
+进度项占位三 · 45%
+指标圆卡组
++ A + 数字占位一指标名称占位一 +
+指标说明占位：用一句话解释这个数字代表什么。
++ B + 数字占位二指标名称占位二 +
+指标说明占位：轻量数据摘要，不做厚重的参数矩阵。
+前后对照卡
+对照标题占位
+对照项标签占位：调整前占位
+对照说明占位：描述原来的状态或做法。
+↓
+对照项标签占位：调整后占位
+对照说明占位：描述变化之后的状态或感受。
+轻重对照清单
+对照清单标题占位
+优势组标签占位
+✓优势条目占位一
+✓优势条目占位二
+✓优势条目占位三
+留意组标签占位
+—注意条目占位一
+—注意条目占位二
+情境对照条
+情境对照说明占位：两种使用情境的并置
+情境一占位情境说明占位：适合安静独处的场景。
+情境二占位情境说明占位：适合与人分享的场景。
+三步流程圆点卡
+流程标题占位
+1步骤标题占位一
+流程说明占位：第一步先做这件事。
+2步骤标题占位二
+流程说明占位：第二步接着做这件事。
+3步骤标题占位三
+流程说明占位：第三步收尾并确认。
+暖色时间线
+时间线标题占位
+●时间节点占位一
+节点说明占位：这一阶段发生了什么。
+●时间节点占位二
+节点说明占位：这一阶段的心情或变化。
+●时间节点占位三
+节点说明占位：时间线在这里收束。
+步骤大数字卡
++ 01 + 阶段标题占位一 +
+阶段说明占位：这一阶段的动作与感受说明，控制在两行以内。
++ 02 + 阶段标题占位二 +
+阶段说明占位：浅杏衬底与白底卡片交替，形成大圆角的呼吸节奏。
+问答呼吸卡
+常见问答标题占位
+问常见问题占位一
+答案说明占位：用平稳的语气回答第一个问题。
+问常见问题占位二
+答案说明占位：第二个问题的回答同样保持柔和。
+问答折叠样式卡
+折叠问答说明占位：静态折叠样式示意
+Q1问题标题占位一
+＋ 展开查看占位
+Q2问题标题占位二
+＋ 展开查看占位
+延伸阅读暖卡
+延伸阅读标题占位
+●延伸标题占位一分类占位 · 阅读量占位
+●延伸标题占位二分类占位 · 阅读量占位
+●延伸标题占位三分类占位 · 阅读量占位
+资料引导条
+↓资料说明占位：配套资料与获取方式说明。
+获取方式占位
+作者暖名卡
+作者名占位
+作者身份占位 · 领域占位
+作者简介占位：一句话介绍作者的兴趣与写作方向。
+联系方式卡
+ + + +居中花点分隔
+· ● ·
+ + +暖橙主行动卡
+行动主标题占位
+行动说明占位：一句话说清楚下一步做什么，语气积极。
+ 按钮文案占位 +行动备注占位：补充说明一行
+双按钮行动条
+ + + +邀约互动卡
+邀约标题占位
+邀约说明占位：邀请读者一起参与某件温柔的小事。
+ 留言互动占位 +温暖收束卡
+结语标签占位
+收束标题占位
+收束要点占位一
+收束要点占位二
+收束要点占位三
+结语文字占位：一句收尾的温暖话，像把杯子轻轻放回桌上。
+互动留言区
+互动问题占位
+互动引导占位：把问题抛给读者，邀请他们在留言区聊聊。
++ 选项占位一 + 选项占位二 +
+留言引导占位：点赞占位 · 在看占位 · 分享占位
+再会祝福尾签
+· · ·
+祝福语占位：愿你今天也被温柔对待
+结尾落款占位 · 下期预告占位
+def make_skill(name):
-return f"已生成 {name}"
-print(make_skill("gzh-design"))
+def make_skill(name):
+return f"已生成 {name}"
+print(make_skill("gzh-design"))
+
— 图片说明文字
``` @@ -88,7 +88,7 @@GIF 动图 - 动图说明文字 + 动图说明文字
``` @@ -102,9 +102,9 @@ ```html🎬
-待补素材
-此处插入：创建 skill 的录屏演示
+🎬
+待补素材
+此处插入：创建 skill 的录屏演示
+
小标题文字
``` @@ -138,14 +138,14 @@ ```html- 小标题文字 + 小标题文字
``` ### 3c. 序号药丸 + 标题（清单/步骤） ```html -+
01 要点标题
@@ -155,7 +155,7 @@ ```html+
「这里是核心观点或关键金句」
提示
-+
提示或旁注的正文内容
diff --git a/skills/le-wechat-article/references/themes/theme-generator.md b/skills/le-wechat-article/references/themes/theme-generator.md index 5c89214..b8bb482 100644 --- a/skills/le-wechat-article/references/themes/theme-generator.md +++ b/skills/le-wechat-article/references/themes/theme-generator.md @@ -207,7 +207,7 @@ 也就是说，需要覆盖文章排版常见场景，但"覆盖全面"不等于"固定骨架"；你必须根据主题结构模型决定哪些类别更重、哪些类别更轻、哪些类别需要细分出更多变体。 至少包含以下大类 Block： -- 头图 / Hero / 封面 +- 头图 / Hero / 封面（开篇组件必须是 ENGINE「版式基线」的轻量导语条形态：栏目标签 + 一句话导语，无大字主标题/头图/落款；正文字号 ≥15px、卡片侧边 padding ≤14px、容器/模块侧边 ≤6px（HTML 每侧合计 ≤16px）） - 章节标题 / 小节标题 / 标签标题 - 正文段落 / 强调段落 / 行内代码段落 - 引用块 / 提示卡 / 警示卡 / 成功卡 / 信息卡 diff --git a/skills/le-wechat-article/references/themes/theme-graphite-minimal.md b/skills/le-wechat-article/references/themes/theme-graphite-minimal.md index 00b4c22..9c17522 100644 --- a/skills/le-wechat-article/references/themes/theme-graphite-minimal.md +++ b/skills/le-wechat-article/references/themes/theme-graphite-minimal.md @@ -30,11 +30,11 @@ 极浅灰底： #FAFAFA（引用块 / 目录卡 / 提示块，正文底保持纯白） 纯白底： #FFFFFF 强调色（暖橙）： #F97316（全篇 ≤3 处，仅用于锚点点睛） -正文字号： 15px（不可改） +正文字号： 16px（不可改） 行高： 1.8 字间距： 0.3px 最大宽度： 677px -内容区边距： 0 10px（左右各 10px） +内容区边距： 0 4px（模块边距，卡片侧边 10~12px） 章节间距： 56px（后续章节 margin-top） ``` @@ -63,16 +63,16 @@ > - 纯白底 + 上下各 1px 石墨极细线框定 + 大号金句，无色块、无阴影、无圆角，完全依靠细线与留白产生质感 ```html -QUOTE
-+
{{金句前段}} {{石墨下划线关键词}} {{金句收尾}}
-+
—— {{作者名，未知则删整行}}
本文看点
01
-{{看点一}}
+{{看点一}}
02
-{{看点二}}
+{{看点二}}
03
-{{看点三}}
+{{看点三}}
+
01
{{ENGLISH TAG}}
-+
∞
``` @@ -168,7 +168,7 @@ **基础段落**： ```html -+
{{正文内容}}
``` @@ -176,7 +176,7 @@ **带关键词下划线标记的段落**（推荐默认）： ```html -+
{{前半句}} {{需要强调的关键短语}} {{后半句}} @@ -192,7 +192,7 @@ > `###` 子标题用石墨左竖条 + 深炭标题，**不套用组件 5 的水印编号章节样式**（水印编号只给 `##`）。竖条 3px 石墨灰，贴合极简气质。 ```html -
+
{{子标题}}
``` @@ -222,7 +222,7 @@ ### 7b. 极浅灰底深炭字标签（核心概念，每篇 2~4 个） ```html -关键词标签 +关键词标签 ``` ### 7c. 极浅灰背景高亮（次要关键词） @@ -252,7 +252,7 @@ ### 7g. 行内代码 ```html -code +code ``` --- @@ -264,8 +264,8 @@ > 左侧 3px 石墨灰竖条 + 大留白 + 深炭字，无底色，靠竖条与缩进建立层级，呼吸感极强。 ```html -
+
「{{核心观点或关键金句}}」
REFERENCE
+
{{引用内容，可含 7d 石墨下划线等内联样式}}
+
{{轻量旁注内容}}
+
{{居中金句}}
+
{{重要提示或核心结论}}
+
{{最需要引起注意的内容}}
NOTE
+
{{较多的提示内容}}
+
{{步骤内容}}
+
{{条目说明内容}}
{{列表项内容}} {{列表项内容}} {{列表项内容}} {{列表项内容}} {{列表项内容}} {{列表项内容}}
-
+
{{要点说明}}
{{节点标题}} {{节点内容}} {{节点标题}} {{节点内容}} {{数字}} {{数字}} {{说明}} {{数字}} {{数字}} {{说明}} 01 {{要点标题}} {{要点说明}} {{要点标题}} {{要点说明}} 02 {{要点标题}} {{要点说明}} {{要点标题}} {{要点说明}} 03 {{要点标题}} {{要点说明}} {{要点标题}} {{要点说明}}
+
— {{图片说明}}
+
我是 {{作者名}}，{{一句话简介，如：热衷于分享 AI 观察与干货}}。
+
如果你觉得今天这篇有收获，欢迎
点赞、在看、转发
三连，我们下篇见。
diff --git a/skills/le-wechat-article/references/themes/theme-index.md b/skills/le-wechat-article/references/themes/theme-index.md
index 6f30831..aa69128 100644
--- a/skills/le-wechat-article/references/themes/theme-index.md
+++ b/skills/le-wechat-article/references/themes/theme-index.md
@@ -14,6 +14,7 @@
| 留白禅意风 | `#4A5D52` 墨绿 | 禅意冥想、极简生活、深度随笔、艺术留白（呼吸感最强） | `references/theme-zen-whitespace.md` | `border-bottom:1.5px solid #B5C8BC;font-weight:500;` |
| 摸鱼票据风 | `#059669` emerald | 测评、工具对比、创意评测（票据/门票视觉隐喻，星级评分+编号+硬阴影卡片） | `references/theme-moyu-ticket.md` | `border-bottom:2px solid #A7F3D0;font-weight:600;` |
| 橄榄手记 | `#1e1f23` 墨黑（配橙 `#ed7b2f`） | 内刊手记、深度评测、案例复盘、系统性说明文档（编辑部内刊质感，分节形式多样，信息密度偏高） | `references/theme-olive-journal.md` | `border-bottom:2px solid #ed7b2f;font-weight:600;` |
+| 暖橙风 | `#EE7A2D` 暖橙 | 品牌发布、产品介绍、心理陪伴、生活方式（圆角暖卡、浅杏衬底、呼吸留白） | `references/theme-warm-orange.md` | `border-bottom:2px solid #F9C9A3;font-weight:600;` |
## 选择建议
diff --git a/skills/le-wechat-article/references/themes/theme-moyu-green.md b/skills/le-wechat-article/references/themes/theme-moyu-green.md
index d69f58f..17072f9 100644
--- a/skills/le-wechat-article/references/themes/theme-moyu-green.md
+++ b/skills/le-wechat-article/references/themes/theme-moyu-green.md
@@ -12,7 +12,7 @@
> - 所有"装饰性空元素"（圆点、渐变分割线、装饰短横、时间线竖线）**必须在内部放 ` ` 里混多个不同 `font-size`——微信编辑器会自动"纠正"导致样式被重写。正确做法：拆成多个 ` `，每个 ` ` 只有一个字号；高亮样式统一挂在外层 `` 上
> - 不用 `position:absolute` 做划线/高亮，删除线用 `text-decoration:line-through`
-> - 结构化区域（如封面右侧图片槽位）没有内容时**整块删掉**，不留空 section
+> - 结构化区域（如作者头像、图片说明）没有内容时**整块删掉**，不留空 section
---
@@ -39,12 +39,12 @@
浅边框： #E5E7EB
浅灰背景： #F3F4F6
极浅灰： #F9FAFB
-正文字号： 14px（不可改）
+正文字号： 15px（不可改）
正文行高： 1.9
全局行高： 1.75
字间距： 0.5px
最大宽度： 677px
-内容区边距： 0 20px（模块左右各 20px）
+内容区边距： 0 12px（卡片通栏为主，卡片侧边 12px，封面卡外边距 8px）
```
字体栈：`-apple-system,BlinkMacSystemFont,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif`
@@ -63,93 +63,35 @@
---
-## 组件 2 封面 cover-breaking（杂志快讯封面）
+## 组件 2 封面 cover-breaking（快讯导语条）
> **文案策略（先读，比代码重要）**：
-> - 封面标题和公众号外标题是**两层标题**，必须视角错开——外标题卖"为什么点开"，封面卖"里面讲什么"
-> - 已知外标题时，主标题**禁止原样复述**其核心关键词（产品名/功能名/场景词）；未知外标题时从五个视角（**数字反差 / 角色革命 / 案例串 / 方法论 / 情绪钩子**）自选一个直出，不停下来问
-> - 产品名/功能名只允许出现在**底部品牌条**或**副标题关键词条**，不出现在大字主标题
+> - 公众号后台已承担标题、封面图、账号名，开篇不再重复——本组件**不放大字主标题、不放头图**；开篇导语和外标题是**两层**，视角错开——外标题卖"为什么点开"，导语卖"里面讲什么、读完得到什么"
+> - 已知外标题时，导语**禁止原样复述**其核心关键词（产品名/功能名/场景词）；未知外标题时从五个视角（**数字反差 / 角色革命 / 案例串 / 方法论 / 情绪钩子**）自选一个直出，不停下来问
+> - 认知翻转签名保留：划线旧认知在上，导语一句话给出新认知
+> - 产品名/功能名只允许出现在**底部品牌条**
> - 仅当用户要求"帮我定封面方向"时才列 3-5 个方向让用户选
-**有右侧图片版**：
-
```html
{{要点标题}}
+
{{要点标题}}
+
{{列标题}}
@@ -544,7 +544,7 @@
> 极简线框图片容器，无圆角、无阴影，1px 细线边框延续几何极简语言。
```html
-
@@ -586,12 +586,12 @@ GIF 动图角标改极简描边胶囊：边框与字色用石墨主色 `#52525B`
> 固定签名文案以正文段落形式呈现；有个人名片 / 引导图素材才放图，无素材整块删。
```html
-
` 占位**，否则微信会剥掉样式
> - **不要把 `font-size`/`border-bottom` 打在 `` 上**，也不要在同一个 `