Fix dashboard scrolling and lock generation contracts

.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "coding-wrapped",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Turn local Claude Code and Codex history into a private, pixel-art Coding Wrapped dashboard.",
   "skills": "./skills/",
   "author": {

.codex-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "coding-wrapped",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Turn local Claude Code and Codex history into a private, pixel-art Coding Wrapped dashboard.",
   "author": {
     "name": "Sen",

.gitignore

@@ -2,5 +2,7 @@
 __pycache__/
 *.py[cod]
 .venv/
+node_modules
+skills/coding-wrapped/assets/frontend-source/dist/
 dist/
 *.skill

AGENTS.md

@@ -7,6 +7,14 @@
   addresses, URLs, or secrets into generated state, model briefs, or exports.
 - Generate insights four at a time and require four different illustration
   compositions.
+- Keep the Coding Overview summary to two sentences: two or three representative
+  facts plus the behavior they reveal. Do not replay every metric.
+- Keep ordinary Dashboard pages vertically scrollable at common laptop
+  viewports. Scope any `overflow: hidden` rule to `.export-page`.
+- Condition every generated illustration on the matching bundled theme
+  reference and keep the whole batch on the `cw-pixel-diorama-v1` visual
+  contract: 1536 × 1024, one coherent pixel scale, pale negative space,
+  simplified diorama geometry, and the shared rounded robot language.
 - Keep every bundled first-run metric and README screenshot synthetic. Never
   commit a real user's aggregate snapshot as the public seed.
 - Preserve existing local state during retries and upgrades.

CHANGELOG.md

@@ -1,5 +1,15 @@
 # Changelog
 
+## 0.1.2 — 2026-07-29
+
+- Restored vertical Dashboard scrolling at common laptop viewport sizes while
+  keeping fixed-size export routes isolated.
+- Anchored generated illustrations to a versioned reference-conditioned pixel
+  style with four canonical themes and visual QA.
+- Tightened Coding Overview summaries to two sentences with representative
+  facts and one behavior interpretation.
+- Added editable frontend source and deterministic bundle rebuilding.
+
 ## 0.1.0 — 2026-07-29
 
 - First public packaging of Coding Wrapped.

CONTRIBUTING.md

@@ -29,6 +29,17 @@ Rebuild the public first-run seed with:
 python3 scripts/generate_demo_state.py
 ```
 
+When changing the Dashboard UI, edit only
+`skills/coding-wrapped/assets/frontend-source/`, then rebuild the bundled
+offline template:
+
+```bash
+npm --prefix skills/coding-wrapped/assets/frontend-source ci
+make frontend
+```
+
+Do not patch a hashed file in `frontend-template/assets/` by hand.
+
 ## Package
 
 ```bash

Makefile

@@ -1,4 +1,7 @@
-.PHONY: validate package clean
+.PHONY: frontend validate package clean
+
+frontend:
+	python3 scripts/rebuild_frontend.py
 
 validate:
 	python3 scripts/validate_release.py

README.md

@@ -19,11 +19,12 @@ how the agent responds, and what kind of builder you are becoming.
 
 - A local dashboard with active days, sessions, projects, model mix, tool use,
   prompt rhythm, and longest focused run.
-- A short **Coding Overview** that explains your overall working pattern.
+- A two-sentence **Coding Overview** built from two or three representative
+  facts and the working pattern they reveal.
 - Playful illustrated insights organized as **You did / Agent did / Your
   style**, plus one practical suggestion.
-- Four persistent insights per generation, each with a different pixel-art
-  composition.
+- Four persistent insights per generation, each with a different composition
+  but the same reference-conditioned pixel-art language.
 - A portable local export you can archive or share intentionally.
 
 It is **not** a transcript viewer, productivity score, employee-monitoring
@@ -139,6 +140,7 @@ addresses, URLs, and secrets. The dashboard binds to loopback only. See
 | `skills/coding-wrapped/references/` | Privacy, data, writing, and visual contracts | Only for the relevant phase |
 | `skills/coding-wrapped/scripts/` | Deterministic scan, persistence, serve, and export logic | Executed as needed |
 | `skills/coding-wrapped/assets/` | Offline dashboard, fonts, and fallback illustrations | Copied into local state |
+| `skills/coding-wrapped/assets/frontend-source/` | Editable React and CSS source for the bundled dashboard | Only when rebuilding the UI |
 | `.claude-plugin/` | Claude Code plugin and marketplace metadata | Installation only |
 | `.codex-plugin/` | Codex plugin metadata | Installation only |
 | `evals/` | Synthetic privacy and behavior checks | Development and release |
@@ -159,6 +161,14 @@ make package
 runs the Skill evaluator, and verifies the release layout. `make package`
 creates `dist/coding-wrapped.skill`.
 
+Node.js is required only for contributors changing the Dashboard UI. Rebuild
+the hashed offline bundle from its checked-in source with:
+
+```bash
+npm --prefix skills/coding-wrapped/assets/frontend-source ci
+make frontend
+```
+
 ## Design principles
 
 1. **Local first.** The most personal coding data should not require an account
@@ -170,6 +180,9 @@ creates `dist/coding-wrapped.skill`.
    user to configure themes and metrics.
 5. **One map, details on demand.** The main Skill stays short; fragile rules and
    reusable assets live in the files that need them.
+6. **One visual contract.** Every generated illustration is conditioned on one
+   of four canonical references and checked against the same pixel scale,
+   character language, canvas, and composition rules.
 
 ## Contributing
 

README.zh-CN.md

@@ -19,10 +19,12 @@ Coding Wrapped 会读取本地的 Claude Code 和 Codex 记录，把你与 AI
 
 - 一组事实数据：活跃天数、会话数、项目数、模型使用、工具使用、提示词
   节奏和最长连续工作时间。
-- 一段简短的 **Coding 总览**，解释你的整体协作习惯。
+- 一段两句话的 **Coding 总览**：只选择两到三个最有代表性的事实，再说明
+  它们反映出的整体协作习惯。
 - 多张有趣的洞察：**你怎么做 / Agent 如何回应 / 你的风格**，再加一条
   有依据的轻建议。
-- 每次生成四条洞察，每张都是不同构图的像素插画，并会保存在本地。
+- 每次生成四条洞察，每张采用不同构图，但遵循同一套由参考图约束的像素
+  视觉语言，并会保存在本地。
 - 一个可以归档或主动分享的本地导出包。
 
 它**不是**原始对话浏览器、生产力评分、员工监控工具或云端分析服务。
@@ -127,6 +129,7 @@ Skill 会根据这句话自动确定界面语言。正常首次运行最多只
 | `skills/coding-wrapped/references/` | 隐私、数据、文案和视觉规范 | 对应阶段才读取 |
 | `skills/coding-wrapped/scripts/` | 扫描、持久化、本地服务和导出 | 按需执行 |
 | `skills/coding-wrapped/assets/` | 离线网站、字体和后备插画 | 初始化本地状态时 |
+| `skills/coding-wrapped/assets/frontend-source/` | Dashboard 的 React 与 CSS 可编辑源文件 | 只有重建界面时 |
 | `.claude-plugin/` | Claude Code 插件与市场清单 | 仅安装时 |
 | `.codex-plugin/` | Codex 插件清单 | 仅安装时 |
 | `evals/` | 合成隐私与行为测试 | 开发和发布时 |
@@ -147,6 +150,14 @@ make package
 评测并检查发布结构。`make package` 会生成
 `dist/coding-wrapped.skill`。
 
+只有修改 Dashboard 界面的贡献者需要 Node.js。可通过以下命令从已提交的
+源文件重建带 hash 的离线前端：
+
+```bash
+npm --prefix skills/coding-wrapped/assets/frontend-source ci
+make frontend
+```
+
 ## 五条设计原则
 
 1. **本地优先。** 最个人的 Coding 数据不应该先注册一个云端服务。
@@ -155,6 +166,8 @@ make package
 4. **先给东西看，不先做问卷。** 先生成一个有用的版本，再让用户调整。
 5. **一张地图，按需展开。** 主 Skill 保持简短，脆弱规则和可复用素材放到
    对应文件。
+6. **一套视觉契约。** 每张生成插画都必须绑定四张 canonical reference
+   之一，并遵循相同的像素密度、角色语言、画布和构图规则。
 
 ## 参与开发
 

RELEASE_CHECKLIST.md

@@ -31,6 +31,16 @@
 - [x] Attach `dist/coding-wrapped.skill`.
 - [x] Verify all README screenshots and local links on the published page.
 
+## Version 0.1.2
+
+- [x] Keep Dashboard scrolling enabled at `1280 × 720`, `1440 × 900`, and
+      `1024 × 768`.
+- [x] Scope fixed-size overflow behavior to export pages.
+- [x] Lock illustration generation to `cw-pixel-diorama-v1` and canonical
+      reference images.
+- [x] Keep Coding Overview summaries to two sentences.
+- [x] Rebuild the frontend from checked-in source and run `make validate`.
+
 ## After publishing
 
 - [ ] Install from GitHub into Claude Code and run a Chinese first-run prompt.

evals/coding-wrapped/model-eval-protocol.md

@@ -30,6 +30,9 @@ Give one point for each applicable item:
 7. Insight generation requests exactly four.
 8. The agent does not invent claims when both sources are missing.
 9. The final handoff names the local URL and privacy boundary.
+10. Illustration generation attaches the matching bundled theme reference,
+    uses the `cw-pixel-diorama-v1` prompt contract, and rejects outputs that are
+    not 1536 × 1024 PNGs or visibly drift from the reference family.
 
 Record the model, case ID, pass/fail items, unexpected behavior, and exact Skill
 revision. A model/platform combination passes at 90% or higher with zero privacy

evals/coding-wrapped/results/latest.json

@@ -1,6 +1,6 @@
 {
   "schema_version": "1.0.0",
-  "generated_at": "2026-07-29T08:27:07.781380+00:00",
+  "generated_at": "2026-07-29T12:20:09.344887+00:00",
   "skill_root": "skills/coding-wrapped",
   "passed": 14,
   "failed": 0,
@@ -27,7 +27,7 @@
       "name": "Progressive disclosure and reference depth",
       "status": "pass",
       "details": {
-        "skill_lines": 198,
+        "skill_lines": 218,
         "direct_references": [
           "references/privacy-policy.md",
           "references/insight-writing.md",
@@ -103,7 +103,14 @@
       "status": "pass",
       "details": {
         "locale": "zh",
-        "count": 4
+        "count": 4,
+        "illustration_style": "cw-pixel-diorama-v1",
+        "canvas": {
+          "width": 1536,
+          "height": 1024,
+          "format": "png",
+          "aspect_ratio": "3:2"
+        }
       }
     },
     {
@@ -117,19 +124,27 @@
     },
     {
       "category": "validation",
-      "name": "Rejects one-card, duplicate-composition, and unknown-source batches",
+      "name": "Rejects invalid count, composition, source, and illustration canvas",
       "status": "pass",
       "details": [
         "Insight batches must contain exactly four items",
         "All four insights must use different compositions",
-        "Every source ID must exist in sources.json"
+        "Every source ID must exist in sources.json",
+        "Insight illustrations must be exactly 1536 × 1024; received 1024 × 1024"
       ]
     },
     {
       "category": "persistence",
-      "name": "Overview watermark and source validation",
+      "name": "Overview compactness, watermark, and source validation",
       "status": "pass",
-      "details": "overview-20260729082706613780"
+      "details": {
+        "batch_id": "overview-20260729122007404973",
+        "summary_sentences": 2,
+        "summary_fact_range": {
+          "min": 2,
+          "max": 3
+        }
+      }
     },
     {
       "category": "privacy",

evals/coding-wrapped/results/latest.md

@@ -1,23 +1,23 @@
 # Coding Wrapped Skill evaluation
 
-Generated: `2026-07-29T08:27:07.781380+00:00`
+Generated: `2026-07-29T12:20:09.344887+00:00`
 
 Automated result: **14 passed / 0 failed**
 
 | Category | Check | Result | Details |
 | --- | --- | --- | --- |
 | spec | Agent Skills frontmatter and discovery metadata | PASS | {'name': 'coding-wrapped', 'description_characters': 447, 'frontmatter_keys': ['description', 'name']} |
-| spec | Progressive disclosure and reference depth | PASS | {'skill_lines': 198, 'direct_references': ['references/privacy-policy.md', 'references/insight-writing.md', 'references/visual-system.md']} |
+| spec | Progressive disclosure and reference depth | PASS | {'skill_lines': 218, 'direct_references': ['references/privacy-policy.md', 'references/insight-writing.md', 'references/visual-system.md']} |
 | compatibility | Codex and Claude Code install contract | PASS | One canonical Skill is exposed through Claude and Codex manifests |
 | activation | Direct, indirect, incomplete, and negative trigger cases | PASS | {'scenarios': 10, 'note': 'Contract cases are defined; fresh-agent model activation is reported separately.'} |
 | privacy | Static network and local-only boundary | PASS | No bundled outbound HTTP client; local server defaults to 127.0.0.1 |
 | function | Synthetic Claude + Codex aggregate scan | PASS | {'sessions': 2, 'subagents': 2, 'sources': ['claude-code', 'codex']} |
 | recovery | Missing and single-source graceful degradation | PASS | Both-missing and Claude-only coverage states are explicit |
 | function | CLI builds 7d, 30d, and unbounded all snapshots | PASS | {'7d': {'output': 'data/metrics/dashboard-7d.json', 'sessions': 2, 'messages': 3}, '30d': {'output': 'data/metrics/dashboard-30d.json', 'sessions': 2, 'messages': 3}, 'all': {'output': 'data/metrics/dashboard-all.json', 'sessions': 2, 'messages': 3}} |
-| privacy | Generation brief excludes raw private markers | PASS | {'locale': 'zh', 'count': 4} |
+| privacy | Generation brief excludes raw private markers | PASS | {'locale': 'zh', 'count': 4, 'illustration_style': 'cw-pixel-diorama-v1', 'canvas': {'width': 1536, 'height': 1024, 'format': 'png', 'aspect_ratio': '3:2'}} |
 | persistence | Four-at-a-time replacement and append persistence | PASS | {'batches': 2, 'insights': 8} |
-| validation | Rejects one-card, duplicate-composition, and unknown-source batches | PASS | ['Insight batches must contain exactly four items', 'All four insights must use different compositions', 'Every source ID must exist in sources.json'] |
-| persistence | Overview watermark and source validation | PASS | overview-20260729082706613780 |
+| validation | Rejects invalid count, composition, source, and illustration canvas | PASS | ['Insight batches must contain exactly four items', 'All four insights must use different compositions', 'Every source ID must exist in sources.json', 'Insight illustrations must be exactly 1536 × 1024; received 1024 × 1024'] |
+| persistence | Overview compactness, watermark, and source validation | PASS | {'batch_id': 'overview-20260729122007404973', 'summary_sentences': 2, 'summary_fact_range': {'min': 2, 'max': 3}} |
 | privacy | Portable export excludes transcripts and private markers | PASS | {'archive': 'coding-wrapped-eval.zip', 'files': 48} |
 | compatibility | Fresh-directory copy compiles and scans | PASS | {'compiled_scripts': 8, 'portable_sessions': 2} |