wangle/MetaSkill
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

le-wechat-article v1.5.1：版式基线落地——①开篇轻量化：四张封面卡（暖橙/摸鱼绿/摸鱼票据/橄榄）瘦身为导语条，去大字主标题/头图/公司落款（公众号后台已承担），补齐「导语与外标题错层」文案策略；②侧边距：微信 App 自带边距为主边距，HTML 每侧合计 ≤16px（容器/模块 ≤6px、卡片 10~14px、嵌套 ≤12px），全 7 主题合计 156 处收紧，正文列宽占屏 69~76%→80%+；③字号阶梯整体 +1（≥12px 全升 414 处：正文 15→16px、moyu 系 14→15px，≤11px 装饰微标不动）；ENGINE 新增「版式基线」三铁律（v1.5.1）+ theme-generator 生成钩子，未来新主题强制合规；新增暖橙主题 theme-warm-orange（36 组件，含预览资产）并入主题库，SKILL.md 主题计数 6→7；topic-facts 补「超级 AI 妈妈」客户事实卡

Browse Source
This commit is contained in:
leroy
2026-11-07 15:45:11 +08:00
parent 08c615d9fd
commit f7b7740829
15 changed files with 1664 additions and 498 deletions
Download Patch File Download Diff File Expand all files Collapse all files
skills/le-wechat-article/references/themes/common-components.md
+17 -17
View File
@@ -20,12 +20,12 @@
<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:#FF5F56;margin-right:7px;font-size:0;line-height:0;overflow:hidden;">.</span>
<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:#FFBD2E;margin-right:7px;font-size:0;line-height:0;overflow:hidden;">.</span>
<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:#27C93F;font-size:0;line-height:0;overflow:hidden;">.</span>
<span style="margin-left:12px;font-size:12px;color:#64748B;font-family:Consolas,Monaco,monospace;letter-spacing:1px;"><span leaf="">python</span></span>
<span style="margin-left:12px;font-size:13px;color:#64748B;font-family:Consolas,Monaco,monospace;letter-spacing:1px;"><span leaf="">python</span></span>
</section>
<section style="padding:11px 14px;">
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:13px;line-height:1.6;color:#E2E8F0;"><span leaf="">def make_skill(name):</span></p>
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:13px;line-height:1.6;color:#E2E8F0;"><span leaf="">　　return f"已生成 {name}"</span></p>
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:13px;line-height:1.6;color:#E2E8F0;"><span leaf="">print(make_skill("gzh-design"))</span></p>
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:14px;line-height:1.6;color:#E2E8F0;"><span leaf="">def make_skill(name):</span></p>
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:14px;line-height:1.6;color:#E2E8F0;"><span leaf="">　　return f"已生成 {name}"</span></p>
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:14px;line-height:1.6;color:#E2E8F0;"><span leaf="">print(make_skill("gzh-design"))</span></p>
</section>
</section>
```
@@ -37,10 +37,10 @@
```html
<section style="margin:0 0 20px;border-radius:8px;overflow:hidden;background:#F6F8FA;border:1px solid #E5E7EB;border-left:3px solid #DC2626;">
<section style="padding:7px 14px;border-bottom:1px solid #E5E7EB;">
<span style="font-size:12px;color:#9CA3AF;font-family:Consolas,Monaco,monospace;letter-spacing:1px;"><span leaf="">bash</span></span>
<span style="font-size:13px;color:#9CA3AF;font-family:Consolas,Monaco,monospace;letter-spacing:1px;"><span leaf="">bash</span></span>
</section>
<section style="padding:11px 14px;">
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:13px;line-height:1.6;color:#24292F;"><span leaf="">npx skills add gzh-design</span></p>
<p style="margin:0;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:14px;line-height:1.6;color:#24292F;"><span leaf="">npx skills add gzh-design</span></p>
</section>
</section>
```
@@ -50,7 +50,7 @@
### 1c. 行内代码（正文中的 `code` 短片段）
```html
<span style="background:#F1F5F9;color:#DC2626;padding:1px 6px;border-radius:4px;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:14px;"><span leaf="">SKILL.md</span></span>
<span style="background:#F1F5F9;color:#DC2626;padding:1px 6px;border-radius:4px;font-family:'SF Mono',Consolas,Monaco,monospace;font-size:15px;"><span leaf="">SKILL.md</span></span>
```
（文字色 `#DC2626` 换主题主色；底色保持中性浅灰。）
@@ -69,7 +69,7 @@
<span leaf=""><img src="图片URL" style="max-width:100%;height:auto;display:block;margin:0 auto;"></span>
</section>
</section>
<p style="font-size:12px;color:#9CA3AF;text-align:center;margin:0 0 24px;">
<p style="font-size:13px;color:#9CA3AF;text-align:center;margin:0 0 24px;">
<span leaf="">— 图片说明文字</span>
</p>
```
@@ -88,7 +88,7 @@
</section>
<p style="text-align:center;margin:0 0 24px;">
<span style="display:inline-block;background:#FEE2E2;color:#991B1B;font-size:11px;font-weight:700;padding:1px 8px;border-radius:4px;margin-right:6px;"><span leaf="">GIF 动图</span></span>
<span style="font-size:12px;color:#9CA3AF;"><span leaf="">动图说明文字</span></span>
<span style="font-size:13px;color:#9CA3AF;"><span leaf="">动图说明文字</span></span>
</p>
```
@@ -102,9 +102,9 @@
```html
<section style="margin:0 0 24px;padding:30px 20px;border:1.5px dashed #DAD7D2;border-radius:14px;background:#FAFAF8;text-align:center;">
<p style="margin:0 0 10px;font-size:26px;line-height:1;"><span leaf="">🎬</span></p>
<p style="margin:0;font-size:14px;font-weight:700;color:#9CA3AF;letter-spacing:1px;"><span leaf="">待补素材</span></p>
<p style="margin:8px 0 0;font-size:13px;color:#B8B5B0;line-height:1.7;"><span leaf="">此处插入：创建 skill 的录屏演示</span></p>
<p style="margin:0 0 10px;font-size:27px;line-height:1;"><span leaf="">🎬</span></p>
<p style="margin:0;font-size:15px;font-weight:700;color:#9CA3AF;letter-spacing:1px;"><span leaf="">待补素材</span></p>
<p style="margin:8px 0 0;font-size:14px;color:#B8B5B0;line-height:1.7;"><span leaf="">此处插入：创建 skill 的录屏演示</span></p>
</section>
```
@@ -129,7 +129,7 @@
### 3a. 左竖条小标题（最推荐，干净）
```html
<p style="margin:28px 0 14px;font-size:16px;font-weight:800;color:#1C1917;line-height:1.5;border-left:4px solid #DC2626;padding-left:12px;">
<p style="margin:28px 0 14px;font-size:17px;font-weight:800;color:#1C1917;line-height:1.5;border-left:4px solid #DC2626;padding-left:12px;">
<span leaf="">小标题文字</span>
</p>
```
@@ -138,14 +138,14 @@
```html
<p style="margin:28px 0 14px;">
<span style="display:inline-block;background:#DC2626;color:#FFFFFF;font-size:14px;font-weight:700;padding:5px 16px;border-radius:6px;"><span leaf="">小标题文字</span></span>
<span style="display:inline-block;background:#DC2626;color:#FFFFFF;font-size:15px;font-weight:700;padding:5px 16px;border-radius:6px;"><span leaf="">小标题文字</span></span>
</p>
```
### 3c. 序号药丸 + 标题（清单/步骤）
```html
<p style="margin:24px 0 12px;font-size:15px;font-weight:800;color:#1C1917;line-height:1.6;">
<p style="margin:24px 0 12px;font-size:16px;font-weight:800;color:#1C1917;line-height:1.6;">
<span style="display:inline-block;background:#FEE2E2;color:#991B1B;border-radius:5px;padding:1px 9px;margin-right:8px;font-weight:900;"><span leaf="">01</span></span>
<span leaf="">要点标题</span>
</p>
@@ -155,7 +155,7 @@
```html
<section style="margin:0 0 24px;background:#FEF2F2;border-radius:0 10px 10px 0;border-left:4px solid #DC2626;padding:16px 20px;">
<p style="font-size:16px;font-weight:800;color:#991B1B;margin:0;line-height:1.8;">
<p style="font-size:17px;font-weight:800;color:#991B1B;margin:0;line-height:1.8;">
<span leaf="">「这里是核心观点或关键金句」</span>
</p>
</section>
@@ -168,7 +168,7 @@
<p style="margin:0 0 6px;">
<span style="display:inline-block;background:#DC2626;color:#FFFFFF;font-size:11px;font-weight:700;padding:2px 10px;border-radius:4px;letter-spacing:1px;"><span leaf="">提示</span></span>
</p>
<p style="font-size:14px;color:#374151;margin:0;line-height:1.8;">
<p style="font-size:15px;color:#374151;margin:0;line-height:1.8;">
<span leaf="">提示或旁注的正文内容</span>
</p>
</section>