From bcb68a5372f38a5986126bb8c6e2e7b44c433224 Mon Sep 17 00:00:00 2001 From: Hoang Snowy Date: Thu, 22 Oct 2026 08:00:10 +0700 Subject: [PATCH] docs(design): record the Board screens pushed to Claude Design + how this repo syncs Pushed board.html (Autopilot + Knowledge tabs), board-try-the-app, board-autopilot and board-knowledge to the AgentOS Design System project. .design-sync/NOTES.md records that this Blazor repo syncs hand-authored screen cards into that existing project (no converter config), so the next /design-sync doesn't treat it as a first import. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_018WAdQ7Rm24xss5QDSvXtJB --- .design-sync/NOTES.md | 19 +++++++++++++++++++ CLAUDE.md | 2 +- 2 files changed, 20 insertions(+), 1 deletion(-) create mode 100644 .design-sync/NOTES.md diff --git a/.design-sync/NOTES.md b/.design-sync/NOTES.md new file mode 100644 index 0000000..f42c22f --- /dev/null +++ b/.design-sync/NOTES.md @@ -0,0 +1,19 @@ +# Design sync notes + +- Target: the existing Claude Design project **AgentOS Design System** + (`bec4d21d-0fad-4d66-9abe-ed8c711b75c8`, `PROJECT_TYPE_DESIGN_SYSTEM`) — the source of truth named in CLAUDE.md. + Never create a new project for this repo. +- This repo is a Blazor Server app, not a JS component library: the `/design-sync` converter (storybook / package + shapes, `_ds_bundle.js`) does not apply, and there is deliberately no `.design-sync/config.json`. The project's + `components/**` (`.jsx` + `.d.ts` + `.prompt.md`) are hand-kept React twins of the `Btn` / `Field` / `Panel` / + `Icon` vocabulary in `src/AgentOs.Web.Shell`. +- A UI change is synced as hand-authored screen cards under `ui_kits/agentos/*.html`: first line + ``, ``, + only tokens that exist in the project's `tokens/*.css` (check with `get_file` before writing). +- Mirror what the running app shows (capture the lab screen first), monochrome inline SVG icons (an emoji such as ⚡ + renders coloured), `white-space: nowrap` on badges / status text. +- Render each card in light and dark before uploading (local mirror of `styles.css` + tokens, Playwright, `data-theme="dark"`). +- Upload: one `finalize_plan` with exact paths (no deletes unless replacing a card), then `write_files` with + `localPath`. Update the pushed-screens list in CLAUDE.md (Design workflow section) with the new paths and date. +- 2026-10-22: pushed `board.html` (tabs incl. Autopilot + Knowledge), `board-try-the-app.html`, `board-autopilot.html`, + `board-knowledge.html`. diff --git a/CLAUDE.md b/CLAUDE.md index 8766dcf..877fd22 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -136,7 +136,7 @@ real-Postgres test. 3. **`/design-review`** the pulled result (phantom-CSS + vocabulary check) — it must still satisfy `design-system.md`. 4. **Verify E2E** in the standalone Web (light + dark), **commit**, and **push any new/changed component, screen, token, or chrome UP to the Claude Design project** (DesignSync `finalize_plan` → `write_files`) — a UI change that only lands in the repo is **incomplete**. Pushed `.html`/`.jsx` carry a first-line `` marker so the Design System pane indexes them. -Hand-editing the repo directly (Claude Design auth unavailable in a non-interactive session — `/design-login` needs an interactive terminal) is a **fallback**, not an exemption: you STILL push the same change up to Claude Design the moment auth is available (DesignSync `write_files`, or have the user run `/design-login` / use Claude Design's "Send to Claude Code Web"). The project is the source of truth, the repo is the pulled artifact; the two must never drift. Reference of what's already pushed: `tokens/*` + `components/{core,forms,feedback,surfaces,navigation,shell}/*` + `ui_kits/agentos/{home,activities,activities-search,settings,settings-routing,agent-profiles,settings-api-tokens,settings-audit-log,settings-data,settings-platform,settings-prompts,system-about,board,workflow*}.html` (last sync 2026-10-19) + `guidelines/cards/shell-widgets.html`. Keep branding **AgentOS.NET**, one accent, responsive (≤1024 = full-screen sheets). +Hand-editing the repo directly (Claude Design auth unavailable in a non-interactive session — `/design-login` needs an interactive terminal) is a **fallback**, not an exemption: you STILL push the same change up to Claude Design the moment auth is available (DesignSync `write_files`, or have the user run `/design-login` / use Claude Design's "Send to Claude Code Web"). The project is the source of truth, the repo is the pulled artifact; the two must never drift. Reference of what's already pushed: `tokens/*` + `components/{core,forms,feedback,surfaces,navigation,shell}/*` + `ui_kits/agentos/{home,activities,activities-search,settings,settings-routing,agent-profiles,settings-api-tokens,settings-audit-log,settings-data,settings-platform,settings-prompts,system-about,board,board-tasks,board-try-the-app,board-autopilot,board-knowledge,workflow*}.html` (last sync 2026-10-22) + `guidelines/cards/shell-widgets.html`. Keep branding **AgentOS.NET**, one accent, responsive (≤1024 = full-screen sheets). **Commits**: Conventional Commits in English (e.g. `feat(tools):`, `fix(llm):`, `chore(deps):`). Co-author Claude when pair-coded. CI fails if the Release build/test fails.