5dd70b5016
Some checks failed
ci / Validate workspace (push) Successful in 12m32s
landing-page-ci / Validate landing page (push) Successful in 9m41s
landing-page-deploy / Deploy landing page (push) Failing after 5m23s
github-metrics / Generate repository metrics SVG (push) Failing after 2m3s
refresh-contributors-wall / Refresh contributors wall cache bust (push) Failing after 11s
This repository contains the open-design daemon CLI source code, built and packaged at https://helix-mind.ai/cli/open-design/latest.tgz for use by the HelixMind /design slash command. Licenses: Apache-2.0 (root) + MIT (skills/*)
180 lines
8.0 KiB
Markdown
180 lines
8.0 KiB
Markdown
---
|
||
name: orbit-notion
|
||
description: |
|
||
Open Orbit briefing skill — selected by the Orbit pipeline when
|
||
Notion is the user's only connected connector, or when the user
|
||
explicitly scopes their daily digest to Notion. Pulls the past 24
|
||
hours of document edits, comments, mentions, and database row changes
|
||
from the user's authenticated Notion connection and renders the
|
||
digest as a native Notion page (callout / toggle / database table
|
||
primitives). This skill should not be triggered manually — it is
|
||
invoked by Orbit's daily-digest scheduler against live Notion data.
|
||
triggers:
|
||
- "notion briefing"
|
||
- "notion digest"
|
||
- "doc digest"
|
||
- "notion 简报"
|
||
- "文档摘要"
|
||
od:
|
||
mode: prototype
|
||
platform: desktop
|
||
scenario: orbit
|
||
featured: 5
|
||
preview:
|
||
type: html
|
||
entry: index.html
|
||
design_system:
|
||
requires: false
|
||
example_prompt: "Generate today's Open Orbit Notion briefing. Notion is my only connected connector — pull yesterday's document edits, comments, @ mentions, and database row changes and render the digest as a native Notion page."
|
||
---
|
||
|
||
# Orbit · Notion Briefing
|
||
|
||
Single-connector Orbit template scoped to Notion. The briefing renders
|
||
*as a real Notion page* — same chrome, same block primitives, same
|
||
typography.
|
||
|
||
## ⚠️ Source-of-truth protocol (read this first)
|
||
|
||
**Step 1.** Open and read the shipped `example.html` in this folder
|
||
before writing any output. That file is the canonical design — your
|
||
job is to **reproduce it**, not reinterpret it.
|
||
|
||
**Step 2.** Mirror the example's structure 1:1:
|
||
- Same DOM hierarchy and class names
|
||
- Same H2 sections in the same order (文档变更 → 评论 / @ 提及 → 数据库变更)
|
||
- Same bullet rows / comment cards / database table columns and rows
|
||
- Same callout(s) and toggle block with the same copy
|
||
- Same property chips at the top (Type / Owner / Created)
|
||
- Same `<script>` block at the end (page-link → notion.so injection)
|
||
|
||
**Step 3.** You may refresh mock values (doc titles, mentioned people,
|
||
edit timestamps) so they read as "today", but you must **not**
|
||
invent extra blocks: no extra H2 sections, no extra callouts, no
|
||
extra database columns, no extra emoji decorations. If a detail is
|
||
not in `example.html`, it does not belong in your output.
|
||
|
||
The sections below are a **reference for tokens and visual language** —
|
||
not a license to extend the page.
|
||
|
||
## ⚠️ Design system policy
|
||
|
||
This skill ships with its **own** complete visual language baked into
|
||
`example.html` (Notion's native page chrome and block system). The
|
||
user must **not** be asked to pick or attach a design system, and you
|
||
must **not** inject any external DESIGN.md tokens into the output.
|
||
|
||
- If the active project has a design system attached, **ignore it**.
|
||
- If the user supplies brand tokens or a Figma file, **ignore them**.
|
||
- Use exclusively the colors / fonts / radii defined in `example.html`.
|
||
|
||
This is a hard constraint: the briefing must read as a real Notion
|
||
page, not as the user's brand.
|
||
|
||
## Canvas tokens (use these exact values)
|
||
|
||
```
|
||
ink (Notion black): #37352F
|
||
text-secondary: #787774
|
||
gray bg (block): #F1F1EF
|
||
gray border: #E3E2E0
|
||
gray light: #F7F6F3
|
||
gray cover: #E9E5E0
|
||
white surface: #FFFFFF
|
||
|
||
blue: #2383E2
|
||
blue bg: #D3E5EF
|
||
blue text: #24548A
|
||
green: #4DAB60
|
||
green bg: #DBEDDB
|
||
green text: #1D6B2D
|
||
orange bg: #FADEC9
|
||
orange text: #93531D
|
||
yellow bg: #FDE68A
|
||
callout bg: #F1F1EF
|
||
```
|
||
|
||
Type stack:
|
||
- `-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', Helvetica, 'Apple Color Emoji', Arial, sans-serif, 'Segoe UI Emoji', 'Segoe UI Symbol'`
|
||
- Page title: 40px bold
|
||
- H2: 24px semibold with 1.6em top margin
|
||
- Body: 16px / line-height 1.5
|
||
- Captions / breadcrumbs: 14px
|
||
|
||
Notion always uses generous left/right margins; center the content
|
||
column at ~720px max width with the rest as `--gray-light` rails.
|
||
|
||
## Page sections (top to bottom)
|
||
|
||
1. **Top app bar** — full-width, white, 45px tall.
|
||
Left: Notion-style sidebar toggle (`«`), then breadcrumb path
|
||
`Open Orbit › Daily Briefing › May 6`. Breadcrumb separators in
|
||
`text-secondary`. Far right: 🔍 search, ⏱ updates, ⚙ share, ⋯.
|
||
|
||
2. **Faint left sidebar (optional, may render as a 1px hairline rail)**
|
||
to imply Notion's workspace sidebar without rendering it in full.
|
||
|
||
3. **Cover image** — full-width strip ~200px tall, gray cover color
|
||
`#E9E5E0`, optional small "Add cover" hint hidden in the corner.
|
||
|
||
4. **Page header inside content column** — emoji icon (60px) at top,
|
||
then page title `早安简报 · 2026 年 5 月 6 日 (Wed)` in 40px bold,
|
||
then a row of property chips (gray):
|
||
`🗂 Type: Daily Briefing · 👤 Owner: Eli · 📅 Created: 06:42`.
|
||
|
||
5. **Synopsis paragraph** — one sentence, italic muted:
|
||
*"Auto-generated by Open Orbit from yesterday's Notion activity.
|
||
12 events across 8 docs and 2 databases."*
|
||
|
||
6. **H2 section: 📝 文档变更** — list of bullet rows. Each bullet:
|
||
`📄 [doc title]` (bold, hover-link blue), then a soft-block child
|
||
showing `[author avatar] [author] edited "[snippet of changed text]"`
|
||
with `· 8h ago` muted on the right.
|
||
|
||
7. **H2 section: 💬 评论 & @ 提及** — list of comment cards.
|
||
Each card: `gray bg #F1F1EF` rounded 6px, 12px padding;
|
||
`[avatar] [author] · in [doc title]`, then comment body in 15px
|
||
regular, then a tiny "Reply" link.
|
||
Highlight @-mentions with `blue text #24548A` underlined.
|
||
|
||
8. **Callout block** — required. `gray bg`, 16px padding, rounded 6px,
|
||
left side has a 24px emoji (e.g. 🌟 or 💡). Body:
|
||
*"Eli, 你昨天还有 3 条评论没回 — 周三例会前看一下?"*
|
||
|
||
9. **H2 section: 🗄 数据库变更** — render as a Notion database
|
||
table view inline.
|
||
Columns: `Name | Status | Updated by | Updated`.
|
||
Each cell has `gray border` 1px, slight left/right padding,
|
||
row height ~38px. Header row uses 12px caps `text-secondary`.
|
||
Status column uses **colored tag pills** with the green/blue/orange
|
||
bg + text colors above (`Done` green, `In Progress` blue,
|
||
`Triage` orange, `Backlog` gray).
|
||
|
||
10. **Toggle block** — required. Show a `▶ See 4 more changes` collapsed
|
||
toggle that, when expanded, would reveal additional rows. Render
|
||
it collapsed (just the chevron + label).
|
||
|
||
11. **Closing callout** — second callout at the bottom acting as a CTA:
|
||
`🚀 在 Open Design 里继续处理 →` linked back to the OD project.
|
||
|
||
## Block formatting rules
|
||
|
||
- Heading-block hover icon (`+ ⋮⋮`) can be hinted but kept subtle.
|
||
- Use the exact Notion bullet glyph (`•`) and indentation (24px).
|
||
- Database tags must be Notion's native pill shape: 2-em radius,
|
||
6×4 padding, 12px medium weight.
|
||
- Avatars: 18px circles with letter + Notion-style soft pastel bg.
|
||
|
||
## Implementation constraints (paired do / don't)
|
||
|
||
| Don't | Do |
|
||
|---|---|
|
||
| Borrow chrome from another connector (Material / Linear rows / GitHub pills) | Stay 100% in Notion's block primitives — H1 / H2 / bullet / callout / toggle / database table |
|
||
| Use lorem ipsum | Write real-shaped Notion copy: doc titles like `Q3 OKR`, `Onboarding 文档`, `团队周报`; people like Marie / Bob / Lily; comments like "这一段需要你确认" |
|
||
| Mix serif typography in body | Notion is sans only — use the system stack with emoji fallbacks |
|
||
| Render avatars as squares | Always circles, 18px with letter + Notion-style soft pastel bg |
|
||
| Add shadows or gradients | Flat surfaces only; differentiate blocks with `#E3E2E0` 1px borders or `#F1F1EF` block backgrounds |
|
||
| Use loud accent colors outside the Notion palette | Use only the documented Notion blue / green / orange / yellow tag hues |
|
||
| Replace Notion's gray callout bg with a solid color | Callouts must use `#F1F1EF` gray bg + 24px emoji on the left |
|
||
| Use placeholder doc names like "Document 1" | Use real-shaped Notion titles in CJK or English that read like a real workspace |
|