DESIGN.md 已刪除(多數內容是 impeccable 設計工具的過程紀錄:從畫布回寫的宣告、
種子 key、被否決的挑戰者清單,對之後維護這份程式碼沒有幫助)。這裡只留下真的
有工程意義、後續改 src/ui/app.css 與 src/ui/app.js 時用得到的規則。
| 值 | oklch | 對 #1b1f26(機架底)的對比度 |
|
|---|---|---|---|
| SUB 訂閱 | #43a08e |
0.645 0.092 178.4 | 5.24:1 |
| PRV 第三方 | #ad8649 |
0.645 0.092 77.5 | 4.95:1 |
兩者的 L 與 C 逐位相同,只有色相(hue)不同 —— 因為訂閱與第三方沒有高下之分, 哪一邊在畫面上更搶眼都是說謊。改配色時要維持這個等式,不要只憑肉眼調亮度。
告警色 #e0563c(oklch 0.631 0.178 32.7)是唯一被允許打破這個色階的顏色:
明度落在兩個席位色附近,但彩度是它們的 1.93 倍,所以它一出現就代表被擋下了。
小級數文字用 --alarm-ink #e8705a(對比度 4.9:1),色塊與粗體標題才用原色。
全部動畫包在 @media (prefers-reduced-motion: reduce) 的關閉分支裡(見 app.css
的 .slot, .strip, .band > div, .load > i, .clearance { transition: none } 與
.slot.fresh > .strip { animation: none })。閒置時整面板本來就是死的,會動的只有
三件事:新進條印進機架的下滑淡入、進條推出/收回的位移、分流帶每一段的寬度變化 ——
這三個在 reduced-motion 下全部關掉,不做退化成「變慢」的處理,直接消失。
render() 用 innerHTML 整頁重畫,機架與流量分頁每 3 秒輪詢一次。innerHTML 會把焦點
丟回 body,所以 render() 換之前記下焦點所在控制項的選擇器(data-act/data-key/
data-f 加上外層的 data-eid/data-rid/data-pid,文字欄位連游標位置),換完放回去。
新增可聚焦的控制項時要帶這些 data 屬性之一,否則重繪後焦點會掉。使用者在 #view 裡選字時
輪詢跳過那一輪,不然選取會被換掉。
等寬字族(Cascadia Mono / Consolas / SF Mono / Menlo)沒有任何漢字。字堆疊裡沒列
漢字字型的話,中文會一路掉到泛用的 monospace、由瀏覽器隨便挑,跟同一行的拉丁字母
分屬兩個無關字族。以前的做法是「.num 不准套在中文上」,但這條規則守不住:額度窗、
批註欄、送出的 model 這些欄位的值有時是翻譯字串,還是會套到等寬字。現在 --data 在
monospace 之前列了 JhengHei/Noto Sans TC/PingFang TC,中文逐字掉到它們身上;
.num 仍然只該給對齊用的數字與 token,中文說明照樣走 .hint / .han。
標牌 .lbl、旗標、圖例、按鈕(含 .btn.tiny)、批註欄名都算。壓縮字體在 10px
以下的高 DPI 與小視窗上讀不出來。旗標另外要實色、不用透明度 —— 它是「顏色不是唯
一訊號」的承載點,自己不能掉到對比地板以下。
路由分頁機架上的 HIT / SHDW / PASS 是「跑過一次排程預覽」的答案,不是規則
自身的狀態。沒跑過預覽就一條都不標,每條只印自己的 ON / OFF —— 一進畫面就把
第一條點亮、其餘壓暗,會被讀成「下面那幾條規則不會生效」。標記亮著的時候,抬頭掛
一塊模擬中的標示連同這次模擬的條件,旁邊給一顆收掉它的鍵;規則一改就把整組標記收
掉,因為模擬只描述按下預覽當下的那份規則。
沿用機架的位置語彙:必要項目沒過(Claude Code 跑不起來)是 hold +告警色標籤
塊;能力項目沒過(跑得起來、只是某個能力靜默失效)是 chk,推出 14px、標籤塊維
持導軌灰(上面用淺色字,深色字只有 1.9:1),不發告警色。兩種都印 FAIL,差別在位置
與框,每一列另外印出它屬於必要還是能力。把「看不到 PDF」畫得跟「連不上」一樣響,就是在誇大。
無法判定(模型沒給出測試讀得懂的回覆)印 N/A、放在 chk 的位置:它沒證明 provider 壞了。
結論放在各列上面:先回答「能不能用」,細節才往下看。測試之後改了這個 provider 的任何欄位, 結果壓暗並標出「這是舊設定的結果」—— 不重繪(游標會跳走),直接改那幾個節點。
沿用「在途請求」那一格的形式(大數字+兩行標牌),不另做量表或圓環:它是一個比
例,而分母(tokens)就印在下一行。沒有用量資料時印 –,不印 0% —— 那會被讀成
「快取全沒命中」。