wangjia
c92cd11cc5
新增 .gitea/workflows/ci.yml 五个 Job：
1. lint — shellcheck -S warning 扫描全部 deploy/ shell 脚本
2. unit-test — docker-compose config 语法校验 + nginx -t（桩证书）
3. openapi-check — openapi-spec-validator 验证 design/server/openapi.yaml
4. redline-scan — ci/scan-redline.sh 扫描 UI 文案红线词（design/ jsx/dart/html）
5. image-build — docker build pangolin-edge:ci
附带：
- ci/scan-redline.sh：脱敏扫描脚本，过滤注释行与外部渠道 handle
- ci/nginx-test.sh：自签桩证书 + nginx -t，CI 免依赖真实 Let's Encrypt
- design/server/openapi.yaml：依据 ARCHITECTURE.md §3 展开的 OAS 3.0 完整契约
- dparts.jsx / parts.jsx：修复 killSwitchSub EN 文案「the VPN drops」红线词
→ 改为「connection drops」（行为描述，不提产品类别）
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
穿山甲 VPN — 移动 App UI Kit
iOS / Android 连接界面的高保真可点击原型。极简、暖大地色、双语、支持深浅主题。
运行
打开 index.html。设备框由 ios-frame.jsx(启动组件)提供。完整流程:登录/注册 → 首次引导 → 主应用。可交互:
- 登录 / 注册(
AuthFlow):登录用邮箱 + 密码;注册走「邮箱 → 发送验证码 → 填验证码 → 设置密码」。密码用于多端登录。 - 首次引导(
Onboarding):3 屏(连接全球 → 授权 VPN 配置 → 安全无日志),可跳过。 - 连接键:轻点 → 连接中(旋转 loader + 进度弧)→ 已连接(SAFE + 计时 + 实时速率)。再点断开。
- 底部 Tab:连接 / 节点 / 统计 / 我的。
- 节点:搜索 + 列表,点选切换(已连接时短暂重连),选中态高亮。
- 统计:流量 / 延迟 / 时长指标卡 + 本周柱状图。
- 我的:兑换 & 购买入口、PRO 账户卡、智能分流 / Kill Switch 开关、深色外观开关、语言切换。
- 兑换 & 购买(
RedeemScreen):兑换激活码 + 购买渠道(自助发卡 / Telegram / LINE / 邮箱)。App 内无支付表单——资金流全走外部,符合 VPN 风控。
文件
| 文件 | 内容 |
|---|---|
index.html |
应用状态机:stage(auth/onboarding/app)/ tab / 连接态 / 节点 / 主题 / 计时器 |
parts.jsx |
原子:Icon(内联 Lucide 路径)、Mark(品牌标)、CC(国家码块)、Signal、Pill;SERVERS 数据;STRINGS i18n 字典 |
screens.jsx |
ConnectScreen / ServersScreen / StatsScreen / SettingsScreen / BottomTab / Toggle / Row |
flows.jsx |
AuthFlow(登录/邮箱验证码注册)/ Onboarding(3 屏)/ RedeemScreen(兑换+购买渠道) |
ios-frame.jsx |
设备框启动组件(状态栏 / 灵动岛 / Home 指示器) |
关键模式
- 颜色 / 字体 / 圆角 / 阴影全部走
../../colors_and_type.css的语义 token,组件天然双主题。 - 图标用内联 Lucide 路径数据(
Icon组件),避免 React 中createIcons()时序问题。 - 连接键三态用色环(
box-shadow外环)区分:中性 / clay / success。 - 国家用 2 字母码块,不用 emoji 国旗。