orbit-linear

Orbit · Linear 简报

专为 Linear 定制的单连接器 Orbit 模板。

⚠️ 真相来源协议（请先阅读）

第 1 步。 编写任何输出之前，先打开并阅读此文件夹中的 example.html。 该文件是规范设计——你的 工作是复现它，而不是重新诠释它。

第 2 步。 1:1 复刻示例的结构：

• 相同的 DOM 层级和类名
• 相同的顶部工具栏（面包屑 + 视图切换器 + 周期条 + 主题 切换按钮），仅包含这些项目
• 相同的左侧栏条目，顺序也相同
• 相同的问题分组（“需要你关注” → “昨天更新”）， 行数相同，且默认展开行为相同
• 相同的优先级条 / 状态圆点系统
• 末尾相同的 <script> 代码块（切换 / 主题 / 键盘 / Linear 链接注入）

第 3 步。 你可以更新模拟数据（问题标识符、标题、 标签、时间、负责人），让它们看起来像是“今天”的内容，但 不得添加额外的侧栏条目、额外分组、预览窗格中的额外字段，或 example.html 中 没有的任何界面装饰。

身份保护。 将 example.html 中的每个人名或账号名 都仅视为模拟内容。除非请求或连接器数据明确指出 已授权用户，否则不得根据示例、连接器账号标签、所有者、负责人、发件人或 提及来推断当前用户的显示名称。如果没有明确的当前用户姓名，请使用 you、your、current user、me 或 my 等中性表述。

以下各节是令牌和视觉语言的参考—— 并不意味着可以扩展页面。

⚠️ 设计系统政策

此技能自带一套完整的视觉语言，内置于 example.html（Linear 标志性的紧凑 UI）中。不得要求用户选择或附加设计系统， 也不得将任何外部 DESIGN.md 令牌注入输出。

• 如果当前项目附带了设计系统，忽略它。
• 如果用户提供了品牌令牌或 Figma 文件，忽略它们。
• 仅使用 example.html 中定义的颜色 / 字体 / 圆角半径。

这是硬性要求：简报必须看起来像真实的 Linear 页面，而不是用户的品牌页面。

画布令牌——浅色主题（默认交付）

page bg:           #f4f5f6
surface:           #ffffff
ink:               #1b1c1f
ink-2:             #37393e
ink-3 (muted):     #6c6f78
ink-4:             #9ea1a9

border:            rgba(0,0,0,0.06)
border-card:       rgba(0,0,0,0.08)
border-strong:     rgba(0,0,0,0.12)
hover row:         rgba(0,0,0,0.025)
active row:        rgba(0,0,0,0.05)

accent:            #5e6ad2
accent-bg:         rgba(94,106,210,0.06)

attention accent:  #c77d1a   /* "needs attention" group */
attention bg:      rgba(212,148,14,0.06)

shadow-card:       0 1px 2px rgba(0,0,0,0.04), 0 0 0 1px rgba(0,0,0,0.05)

状态圆点调色板（必须严格使用以下内容）：

backlog:    #9ea1a9   /* gray, hollow ring */
todo:       #d4940e   /* yellow, dashed ring */
progress:   #2b80c5   /* blue, partial ring */
review:     #8759c7   /* purple, partial ring */
done:       #1a8d3a   /* green, filled */
canceled:   #6c6f78   /* gray with strike */

优先级图标 = 4 根垂直短条，高度依次递增。 填充的短条表示级别：0 无 → 4 紧急。 紧急使用 #d4513a；高使用 #c77d1a；中 / 低使用 #505259。

字体栈：

• 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Display', system-ui, sans-serif
• 等宽字体：'Berkeley Mono', ui-monospace, 'SF Mono', 'JetBrains Mono', Menlo, monospace
• 字号：导航 13px，行标题 13.5px，元信息 12px，标题 11px 大写，字母间距 0.04em

页面分区

1. 顶部工具栏 — 单行，高 44px，无阴影，底部有细边框。 左侧：面包屑 Orbit › Daily Digest › May 6（13px，…›… 分隔符 使用 ink-4）。然后是细分隔线，接着是 ▼ My issues 视图切换器。 右侧：🔍 search、+ new、▦ display options、头像。

2. 周期进度条 — 面包屑区域右侧的位置， 单行显示：Cycle 12 · 60% complete · 3 days left。使用 11px 大写字母， 搭配内联的小型进度条（宽 60px，高 4px，填充色为强调色）。

3. 三栏主体：

   • 左侧导航（240px）：纵向排列，无背景 — 条目使用 13px 字号。 分区：Inbox · My issues · Active · Backlog · All issues， 然后是分隔线，接着是 📋 Triage · 🚫 Canceled · ✅ Completed。 当前行：背景为 accent-bg，文字颜色为 accent。 底部：一行小号、低调的 Open Orbit · auto-generated 06:42。
   • 问题列表（flex 1）：分为两组。
     • 需要你关注 — 标题使用 attention accent，11px 大写字母； 分组块使用非常淡的 attention bg 背景。 行内包含：已分配且长期未更新的问题、高优先级／紧急问题。
     • 昨天更新 — 标题使用 11px 大写字母，颜色低调；行内显示状态 变更和已完成的问题。 每行紧凑地显示为一行： [优先级条] [标识符 ENG-148] [状态圆点] [标题……………] [标签] [周期标签] [负责人头像] 行高约 36px。悬停时使用 hover row 颜色。
   • 问题预览（右侧 360px）：预先选中的问题。 大号标题（16px，中等字重）；下方显示 ID + 状态胶囊；描述 段落；活动流（小头像 + 动作描述 + 时间戳）；底部显示标签、 周期标签、负责人行。

标识符／标签规则

• 问题 ID（例如 ENG-148）使用等宽字体，12px，颜色为 ink-3。
• 标签：圆角胶囊，包含一个 4px 彩色圆点、标签文字和可选的 ✕。 每个标签的色相可自行选择，采用真实可信的开发团队配色。
• 周期标签：小号圆角方框 Cycle 12，带细边框。
• 状态圆点：14px 圆形，按上文对应状态使用内部圆环／填充。
• 优先级条：标识符右侧有 4 根短竖条，按级别填充对应数量的竖条。

实现约束（成对的禁止／要求）

禁止	要求
除已列出的 shadow-card token 外添加阴影	卡片仅使用 0 1px 2px rgba(0,0,0,0.04), 0 0 0 1px rgba(0,0,0,0.05)
使用状态调色板以外的鲜艳颜色	仅使用文档规定的状态色相（Backlog 灰色／Todo 黄色／Progress 蓝色／Review 紫色／Done 绿色）和 #5e6ad2 强调色
使用非 Inter 的无衬线字体	使用 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Display', system-ui, sans-serif
使用宽松的行高	行高保持在 40px 以下（目标约 36px）—— Linear 的标志性特点就是信息密集
使用 lorem ipsum	撰写贴近真实的 Linear 文案：标识符如 ENG-148、DES-22、INF-9；周期名称如 Cycle 12；标题如 "Auth middleware refactor"
将头像渲染为方形	始终使用圆形，尺寸为 18–24px
使用深色主题	渲染浅色主题 — 页面使用 #f4f5f6，卡片使用 #ffffff
使用 T-1 等占位团队前缀	使用贴近真实的团队前缀：ENG / DES / INF / OPS