主题模式

主题模式

Teeker 内置了 3 种主题尺寸，8 种主题风格可供切换，在右下角的两个按钮进行体验。

如果想拓展主题尺寸和主题风格，前往 主题模式拓展。

1、主题尺寸

3 种主题尺寸分别为 small、default、large，默认为 default。

• small：首页的文章列表和右侧卡片栏宽度会相对缩小，且文章页的宽度也会相对缩小
• default：Vitepress 默认尺寸
• large：首页的文章列表和右侧卡片栏宽度会放大，且文章页的侧边栏移到最左边，内容区也会尽可能铺满剩下的空间，适合宽屏浏览

可以通过主题配置的 themeSetting.themeSize来设置默认的主题尺寸。

importtkThemeConfig from"vitepress-theme-teek/config";consttkConfig=tkThemeConfig({themeSetting:{themeSize:"large",},});

如果不想在右下角显示主题尺寸切换按钮（不允许用户手动切换），可以设置 themeSetting.useThemeSize为 false：

importtkThemeConfig from"vitepress-theme-teek/config";consttkConfig=tkThemeConfig({themeSetting:{useThemeSize:false,},});

2、主题风格

8 种主题风格分别为 vp-default、vp-green、vp-yellow、vp-red、el-blue、el-green、el-yellow、el-red。

其中 vp-开头的使用 Vitepress 内置的颜色样式，el-开头的使用 Element Plus 的颜色样式。

可以通过主题配置的 themeSetting.themeStyle来设置默认的主题风格。

importtkThemeConfig from"vitepress-theme-teek/config";consttkConfig=tkThemeConfig({themeSetting:{themeStyle:"vp-red",},});

如果不想在右下角显示主题风格切换按钮（不允许用户手动切换），可以设置 themeSetting.useThemeStyle为 false：

importtkThemeConfig from"vitepress-theme-teek/config";consttkConfig=tkThemeConfig({themeSetting:{useThemeStyle:false,},});