flat
没有比喻。中性色、系统字体、蓝色强调。项目还没有自己的声音时用它。
分段按钮上有一块滑块。开关是轨道加旋钮,旁边放当前状态的词。
import '@froq/ui/flat/style.css'
import { Choice, Toggle } from '@froq/ui/flat'
页面或区块加上 class="ui-flat"。
Choice
Tone
plain
Toggle
没写 on-label / off-label 时,旁边的词就是 label。
false
Props
Choice
| Prop | 类型 | 说明 |
|---|---|---|
v-model | string | 当前值,必填 |
options | { value, label }[] | 选项 |
label | string | 可选。这组选择的名字,读屏用 |
Toggle
| Prop | 类型 | 说明 |
|---|---|---|
v-model | boolean | 默认 false |
label | string | 必填。读屏名称。没写 on/off 文案时也当作可见文字 |
on-label | string | 可选。打开时旁边的词 |
off-label | string | 可选。关闭时旁边的词 |
Token
flat
--ui-bg
--ui-fg
--ui-muted
--ui-faint
--ui-line
--ui-accent
--ui-font-display
--ui-font-text
--ui-font-meta
--ui-ease
--ui-dur
--ui-radius