COMPONENTS · EDITOR'S NOTE
編者按 Editor's Note
這是「FLiPER 對讀者說話」的地方,也是黎明橘作為聲音出現的唯一位置。
範例
LIVE EXAMPLE
DO
每篇內容最多一則編者按;署名格式固定。
DON'T
把橘色直線用於一般引言或提示框。
WHY整個系統都是黑白,只有編輯的聲音帶色——讀者一眼就知道:這是我們想對你說的話。
程式碼
SWIFT
FLiPEREditorNote(text: note, attribution: "WHY WE PICKED IT ── FLiPER 編輯室")CSS
.editors-note { border-left: 4px solid var(--accent); padding-left: 20px; }
.editors-note p { font-family: var(--font-serif); line-height: 1.9; }
.editors-note .attr { font: 11px ui-monospace; letter-spacing: .18em; color: var(--accent); }WHEN TO USE
何時使用
用於選文理由或編輯室對讀者說的一段話；接在內容之後或靠近閱讀入口。每篇最多一則，不作系統提示或一般引言。
BEHAVIOR
狀態與互動
| 狀態 | 行為 / 呈現 |
|---|---|
| 預設 Default | 4px 曙光橘直線、宋體內文、固定編輯室署名；文字不需額外底色。 |
| 滑過 Hover | 靜態編者按無 hover；段內真實連結保留底線。 |
| 焦點 Focus | 編者按本身不進入 Tab；段內連結顯示外框，不能被容器裁掉。 |
| 停用 Disabled | 無 disabled；缺少編輯文案時整則不呈現，不顯示空框。 |
GUARDRAILS
使用邊界
DO
保留編輯室口吻與固定署名，把橘色留給真正的編輯聲音。
DON'T
將橘色直線當錯誤、提醒、廣告或受訪者的一般引言。