使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
使用 light/dark 对象实现主题感知颜色。
颜色会根据主题自动切换。
通过 color.search.* 让搜索框在亮/暗色下自动同步。
主要关注点:亮色/暗色主题感知颜色配置。
hero:
background:
type: color
color:
solid:
light: "rgba(248, 250, 252, 1)"
dark: "rgba(15, 23, 42, 1)"
colors:
navText:
light: "rgba(15, 23, 42, 1)"
dark: "rgba(248, 250, 252, 1)"
searchText:
light: "rgba(15, 23, 42, 1)"
dark: "rgba(248, 250, 252, 1)"
searchTextMuted:
light: "rgba(71, 85, 105, 1)"
dark: "rgba(148, 163, 184, 1)"hero.colors.*) | 键 | 说明 |
|---|---|
hero.colors.navText(.light/.dark) | 导航文字颜色 |
hero.colors.navTextScrolled(.light/.dark) | 滚动后导航文字颜色 |
hero.colors.navTextHover(.light/.dark) | 导航悬停/激活文字颜色 |
hero.colors.navTextHoverScrolled(.light/.dark) | 滚动后导航悬停/激活文字颜色 |
hero.colors.navBackground(.light/.dark) | 导航背景色 |
hero.colors.navBackgroundScrolled(.light/.dark) | 滚动后导航背景色 |
hero.colors.searchBackground(.light/.dark) | 搜索按钮背景色 |
hero.colors.searchBackgroundScrolled(.light/.dark) | 滚动后搜索背景色 |
hero.colors.searchHoverBackground(.light/.dark) | 搜索悬停背景色 |
hero.colors.searchHoverBackgroundScrolled(.light/.dark) | 滚动后搜索悬停背景色 |
hero.colors.searchText(.light/.dark) | 搜索文本/图标颜色 |
hero.colors.searchTextScrolled(.light/.dark) | 滚动后搜索文本/图标颜色 |
hero.colors.searchTextMuted(.light/.dark) | 搜索占位与弱化文本颜色 |
hero.colors.searchTextMutedScrolled(.light/.dark) | 滚动后搜索占位与弱化文本颜色 |
hero.colors.searchBorder(.light/.dark) | 搜索边框颜色 |
hero.colors.searchBorderScrolled(.light/.dark) | 滚动后搜索边框颜色 |
hero.colors.searchKeyBackground(.light/.dark) | 快捷键胶囊背景色 |
hero.colors.searchKeyBackgroundScrolled(.light/.dark) | 滚动后快捷键胶囊背景色 |
hero.colors.searchKeyText(.light/.dark) | 快捷键胶囊文字色 |
hero.colors.searchKeyTextScrolled(.light/.dark) | 滚动后快捷键胶囊文字色 |