# Astrion 官网

[Astrion](https://github.com/JOJO6618/astrion)（暂定名「星子」）的官方网站：面向**用户**的使用指南与面向**开发者**的设计原理解读。

> 当前状态：**开发中**——文档文案已完成，主页 demo 正在迭代。

## 仓库结构

```
content/    中文文档文案（11 篇：快速上手/核心概念/对话/输入与上下文/
            执行与安全/对话资产/智能体能力/快捷窗口/设置/CLI）
demo/       主页 demo（深空星空 + 真实前端壳演示区 + 特色功能动画）
```

## 本地预览

```bash
cd demo
python3 -m http.server 8898
```

| 页面 | 地址 | 说明 |
|------|------|------|
| 主页 | http://127.0.0.1:8898/index.html | 星空 + 演示区 iframe + 特色动画 01/02 |
| 修改记录动画 | http://127.0.0.1:8898/anim3-demo.html | 03：编辑→diff→文件卡片→genie 收盒（三轮堆叠） |
| 运行模式动画 | http://127.0.0.1:8898/anim-demo.html | 01：计划/询问/执行 |
| 沙箱动画 | http://127.0.0.1:8898/anim2-demo.html | 02：恶意命令抛物线拦截 |

注意：演示区（demo.html）依赖 Service Worker mock API，必须通过 http 访问（file:// 无效）；改动 `demo.html`/`sw.js` 后需 bump `sw.js` 中的 CACHE 版本号并硬刷新。

## 技术要点

- **演示区 1:1 还原**：`demo/static/` 是主项目前端真实构建产物，Service Worker 拦截 `/api/*` 返回 mock 数据；iframe 内固定 1400×860 逻辑尺寸 + 外层 `transform: scale()` 等比缩放。
- **特色动画**：无边框无底融于星空；03 收盒用「裁切式 genie」——单个 SVG 元素每帧绘制 S 曲线 path（描边跟随轮廓），内容矢量不形变。

## 待办

- [ ] 03 动画集成进主页（容器宽度 540→460 适配）
- [ ] 04 版本控制动画
- [ ] 演示区对话数据编排（3 工作区 6 对话）
- [ ] 响应式复查与正式发布