feat: footer better, font

This commit is contained in:
2026-02-26 03:05:05 +08:00
parent 6153c7e87e
commit e1defbd2dc
18 changed files with 430 additions and 47 deletions

View File

@@ -29,6 +29,7 @@ export default defineConfig({
{ text: "图表", link: "/cli-feature/chart" },
{ text: "辅助工具", link: "/cli-feature/radash" },
{ text: "动画", link: "/cli-feature/motion" },
{ text: "字体", link: "/cli-feature/font" },
],
},
],

53
docs/cli-feature/font.md Normal file
View File

@@ -0,0 +1,53 @@
# 字体
## 自定义字体
脚手架提供了两种自定义字体
- [HarmonyOS_Sans_Regular.woff2](https://developer.huawei.com/consumer/cn/design/resource-V1/)
- [LXGWBright-Regular.woff2](https://github.com/lxgw/LxgwWenKai)
## 使用字体
您可以通过 tailwindcss 的类来调整局部字体,例如:
```html
<div class="font-Harmony">
这是 Harmony 字体
</div>
<div class="font-LXGW">
这是落霞孤鹜字体
</div>
```
您可以在 `style.css` 中定义全局字体,例如:
```css
@plugin "daisyui/theme" {
name: "light";
--color-primary: #5092d4;
--color-secondary: #bfd7f1;
--color-accent: #76b9ef;
/* 自定义字体在 App.vue 中加载 */
--font-sans: '"Harmony", "Microsoft YaHei", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"';
}
```
如果您需要其他自定义字体,请在 `App.vue` 中定义 font-face例如
```vue
<style>
@font-face {
font-family: "LXGW";
src: url("/fonts/LXGWBright-Regular.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}
</style>
```
## 后续目标
后续我们将推出能够实时修改全局字体的组件