Design SystemGetting StartedChangelog

Changelog

這個 Design System 改了什麼。三份清單都是建置時從既有紀錄自動讀出來的，不另外手寫。

最近更新的頁面

最近 30 個 commit 裡改過的站上頁面（最多 12 筆，新到舊）。側欄裡這些頁面旁邊的橘點就是同一份清單。

組件

Patterns · AssetAnalysisCardAdoptedPatterns · AssetAssetDashboardTimelineAdoptedPatterns · AssetAssetPriceTimelineAdoptedPatterns · AssetAssetRowAdoptedPatterns · AssetAssetTrendingCardAdoptedComponentsButtonComponentsCardComponentsCheckboxComponentsDatePicker

頁面

Getting StartedChangelogTemplatesAsset DashboardAdoptedTemplatesFinanceAdopted

組件鏡像同步

Components 欄的組件與 Foundations 的 token 是 production（OpinionLabs/frontend）的鏡像。每次同步一列，最新的在最上面。來源：docs/mirror-sync.md

日期來源 commit變動PR
2026-10-160ac828f+27 ~54 -0；style.css 回到 production 原樣，33 個舊名字退場#204

Design System 更新紀錄

token、組件、規則與站點結構的變更（不含 agent / skill 工具鏈的 System 類）。標題連到 Internal 欄的 System Log 全文。來源：docs/governance/system-log.md

  1. 2026-10-26ArchitectureDS site 公開化第 6 步：中英雙語切換（全部公開頁）
  2. 2026-10-26ArchitectureDS site 公開化第 5 步：新增 Usage / Changelog / Data Viz / Mobile 四頁，側欄 Recently Updated 改成 Changelog 入口
  3. 2026-10-26ArchitectureDS site 公開化第 4 步（第一批）：組件頁統一骨架
  4. 2026-10-17ArchitectureDS site 公開化第 3 步：每頁標上它跟 production 的關係
  5. 2026-10-17ArchitectureDS site 公開化第 2 步：側欄改成六欄公開 + 一欄 Internal
  6. 2026-10-16ArchitectureDS site 公開化第 1 步：封存不該對外的 11 條路由，治理內容離開站點
  7. 2026-10-16ArchitectureDS site 重整第 4 步：首頁重寫 + 新增 Guidelines 區
  8. 2026-10-16ArchitectureDS site 重整第 3 步：封存已結案的 migration 交接頁，Governance 移到 Contributing
  9. 2026-08-05ArchitectureMarket Resolution 交接定案：production patch 交付 + 歷程頁封存
  10. 2026-08-01ArchitecturePrototype 可接 production 真資料：Market Resolution 接上公開 Resolution OpenAPI
  11. 2026-07-28Ruledata-viz token 層補 halftone ink role（--color-data-ink / -strong）
  12. 2026-07-28Architecture圖表引擎收斂到 production 在用的那套（recharts）+ N1 / N8 落地、N10 轉規格交付
  13. 2026-07-28ArchitectureAsset Prediction / BTC Dashboard 兩頁真組件重組 + N5 / N7 圖表落地
  14. 2026-07-28ArchitectureData Visualization 中性語意層（--color-data-*）+ Asset Prediction handoff 首批四組件
  15. 2026-07-18ArchitectureProposal B：Button α overlay 全數改指 mode-aware solid ramp 階（零透明度）
  16. 2026-07-17ArchitectureSportsGameCard（production transplant）取代手刻 MatchCard
  17. 2026-07-06ArchitectureButton skin 名稱對齊底層 token family 命名（改名不改色）
  18. 2026-07-06Rule移除未驗證的 focus-visible pilot（Button/Tabs）+ 全 repo 手刻 focus-visible 樣式一併撤除
  19. 2026-07-06ArchitectureButton 移除未使用的 lightBrand / lightBrand2 skin
  20. 2026-07-06Fixteam-home light mode 文字色 WCAG 不合格修復（新增 team-home-950 token，merge 自 PR #58）
  21. 2026-07-05ArchitectureOutcome/Team pressed 色階補齊：Button 6 skin + Tabs 4 variant 缺口修復
  22. 2026-07-05ArchitectureOutcome/Team 市場色 Layer 3 className 收尾遷移 + featured-icon 兩個失效殘留 token 修正
  23. 2026-07-05Architecturetrend/error 家族 Layer 3 className 遷移完成：舊 flat 名 green-2/red 全數退休刪除，red-live 收編進 brick 家族
  24. 2026-07-05Architecturetrend 家族補齊三層：Tier 2 trend-up/trend-down 落地、Tier 1 去語意化命名 grass/brick、grass/brick/brand 三條完整 ramp 收進 style.css（方案 A），color-target 頁廢除寫死假設稿
  25. 2026-07-05Architecture刪除 yellow primitive、新增 warning-solid/success-solid/error-solid 系統狀態 role token
  26. 2026-07-05ArchitectureTier 1 primitive 去語意化：outcome-yes/no、team-home/away/draw 家族名改成 jungle/cherry/gold/sea/ash，語意收斂到 Tier 2
  27. 2026-07-04Architectureoutcome-yes/no、team-home/away 錨點收斂：插值小數階（550/565）承接 light 真實值，三家族改名不改色、team-home 直接借用既有階
  28. 2026-07-04Architectureneutral / team-draw 灰階 ramp 收斂落地：兩個家族從 overlay 思維 / dual-scale 改成單一 ramp，9 個 Text/Surface/Border 角色 token 從 ◐/○ 全轉 ●
  29. 2026-07-04ArchitectureLayer 3 組件 className 遷移安全批：Storybook 鏡像 Button/Tabs 的 outcome/team 市場色從舊扁平名換成 Tier 2 角色名（改名不改色）
  30. 2026-07-03ArchitectureLive DS Tier 2 semantic role token 接線：22 個角色名（text-primary / bg-secondary / outcome-yes-solid 等）落地 style.css，取代規劃中的扁平命名消費層
  31. 2026-07-04Architecturestyle.css 補齊 outcome-yes/no、team-home/away/draw、yellow 六個家族的完整 50–950 primitive scale（dual dark/light 真實錨點）
  32. 2026-07-03ArchitectureClaude DS 探索層封存（Phase 6）：theme.css/typography.css + 40 展示頁 + 30+ 個孤兒元件全部搬出專案，只留 Live DS + Product Components + Pages
  33. 2026-07-03Architecture產品元件禁用 Claude DS（Phase 5）：button.tsx 5 個可達 color variant + market-feed-layout 兩處 Tabs 換 Live/olab
  34. 2026-07-03Architecture產品元件禁用 Claude DS（Phase 2-4）：15 個產品元件本體 + 5 個真頁面全部換 Live token，收尾完成
  35. 2026-07-03Architecture產品元件禁用 Claude DS（Phase 1）：OutcomeAction/InputNumberBase 重建 + TradePanel Buy/Sell 改用真的 olab Tabs
  36. 2026-07-03Architecture產品元件禁用 Claude DS（Phase 0）：Avatar/ButtonUtility/LiveIndicator/Badges 重建為零 theme.css 依賴
  37. 2026-07-03Architecture全 repo 稽核 Claude DS 指向問題：補上根目錄 README + CLAUDE.md 剩餘兩處，跟另一個並行 session 的修正合併
  38. 2026-07-02FixMatchCard team 色系未選中狀態 + Game View 品牌橘字：對照線上實測修正
  39. 2026-07-02Rule修正子資料夾 CLAUDE.md「theme.css = 唯一真相」的舊規範，改為 Live DS 優先
  40. 2026-07-02Architecture3-way 賽事的下單面板其實是獨立 Yes/No 子市場，不是共用隊伍色 selector——重新架構 TradePanel 資料流
  41. 2026-07-02Fixlive-fidelity-audit skill 首次實跑：4 個平行 agent 抓到 outcome 按鈕寬度未鎖定等根本問題，逐項修正
  42. 2026-07-02FixSports 頁三個目視發現的缺陷 + 根因：驗證方法論漏洞、預設主題未鎖定 dark
  43. 2026-07-01ArchitectureSports 分類頁落地：新增 MatchCard / PromoBanner Product Component，OutcomeAction 擴充 Team 色系
  44. 2026-05-19RuleWorktree preview QA 一律使用 explicit worktree launch entry
  45. 2026-05-15ArchitectureLive Mirror 整合：Ethan @olab/components 進駐，與 Claude DS 雙軌並存
  46. 2026-05-05RuleBase layer typography 治理：base / foundations contract surface 不導入 product semantic token (h*/body*)
  47. 2026-05-05ArchitectureTypography token 對齊 live：新增 product semantic 階（h1/h2/h3 + bodyXl/L/M/S），與 base utility 階並存
  48. 2026-04-29ArchitectureTeam palette anchor 對齊 live：home/away/draw -500 重新定錨 + 整條 scale 重算
  49. 2026-04-29FixLiveIndicator 動畫從 opacity blink 改為 outward ripple
  50. 2026-04-29ArchitectureLIVE indicator：採用上游 --color-live family + 新增 LiveIndicator base component
  51. 2026-04-29ArchitectureHeader surface layer：新增 bg-header semantic token 與 neutral-975 palette 階
  52. 2026-04-28Architecture新增 live token family + LiveGamesModule v2 重構
  53. 2026-04-26Fix/colors page：deprecated token 從 Primitive Scales 抽離為獨立 section
  54. 2026-04-26ArchitectureOutcome 語意 migration — pages / content / incidentals（PR 3c / 3 部曲收尾）
  55. 2026-04-26ArchitectureOutcome 語意 migration — product layer（PR 3b / 3 部曲第 2 步）
  56. 2026-04-26ArchitectureOutcome 語意 migration — base layer（PR 3a / 3 部曲第 1 步）
  57. 2026-04-26ArchitectureOutcome / Team Dual Color System（token foundation）
  58. 2026-04-17ArchitectureLive-token Foundation colors + Recently Updated nav
  59. 2026-04-16ArchitectureMarket Detail (Single) Phase B landing
  60. 2026-04-16ArchitectureMigration to Phase A / Phase B + DS Audit
  61. 2026-04-12RulePressed State Enforcement + Preview Audit Trigger
  62. 2026-04-12RulePressed State Requirement
  63. 2026-04-12RuleOutcomeAction v2 — 3-layer state model
  64. 2026-04-12ArchitectureRefactor to 2 Agents + Skills
  65. 2026-04-12ArchitectureAdded Preview System Curator