nanakura/moeka-project
1
0
Fork 0
Code Issues Pull Requests 1 Actions 2 Packages Projects Releases Wiki Activity

style(stage-ui): new font

Browse Source 
Co-authored-by: Rynco Maekawa <10259119+lynzrand@users.noreply.github.com>
This commit is contained in:
Neko Ayaka
2025-05-30 13:32:19 +08:00
co-authored by Rynco Maekawa
parent 3b7d2222fa
commit a99ba7f50a
2 changed files with 75 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/stage-ui/stories/TypographySans.story.vue
+63 -7
View File
@@ -2,10 +2,13 @@
<Story
title="Typography Sans"
group="design-system"
:layout="{ type: 'grid', width: 200 }"
:layout="{ type: 'grid', width: 350 }"
>
<Variant title="Sans">
<div>
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-sans>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-sans>
Hello, world!
@@ -21,7 +24,10 @@
</Variant>
<Variant title="Quanlai Sans">
<div>
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-quanlai>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-quanlai>
Hello, world!
@@ -37,7 +43,10 @@
</Variant>
<Variant title="Xiaolai Sans">
<div>
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-xiaolai>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-xiaolai>
Hello, world!
@@ -53,7 +62,10 @@
</Variant>
<Variant title="Cute Sans">
<div>
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-cuteen>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-cuteen>
Hello, world!
@@ -69,7 +81,10 @@
</Variant>
<Variant title="Jura Sans">
<div>
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-jura>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-jura>
Hello, world!
@@ -85,7 +100,10 @@
</Variant>
<Variant title="Tech Sans">
<div>
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-quicksand>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-quicksand>
Hello, world!
@@ -99,5 +117,43 @@
</div>
</div>
</Variant>
<Variant title="Urbanist">
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-urbanist>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-urbanist>
Hello, world!
</div>
<div bg="red-100 dark:red-900" w-fit font-quicksand>
こんにちは、世界！
</div>
<div bg="red-100 dark:red-900" w-fit font-quicksand>
你好，世界！
</div>
</div>
</div>
</Variant>
<Variant title="M PLUS Rounded 1c">
<div flex flex-col gap-1>
<div mb-3 text-4xl font-bold tracking-wide font-m-plus-rounded>
<span text="neutral-500 dark:neutral-400">Project</span> <span text-pink>AIRI</span>
</div>
<div flex flex-col gap-1>
<div font-m-plus-rounded>
Hello, world!
</div>
<div font-m-plus-rounded>
こんにちは、世界！
</div>
<div font-m-plus-rounded>
<span bg="red-100 dark:red-900">你</span>好，世界！
</div>
</div>
</div>
</Variant>
</Story>
</template>
uno.config.ts
+12 -10
View File
@@ -63,22 +63,24 @@ export function sharedUnoConfig() {
presetTypography(),
presetWebFonts({
fonts: {
sans: 'DM Sans',
serif: 'DM Serif Display',
mono: 'DM Mono',
cute: 'Kiwi Maru',
cuteen: 'Sniglet',
jura: 'Jura',
gugi: 'Gugi',
quicksand: 'Quicksand',
quanlai: {
'sans': 'DM Sans',
'serif': 'DM Serif Display',
'mono': 'DM Mono',
'cute': 'Kiwi Maru',
'cuteen': 'Sniglet',
'jura': 'Jura',
'gugi': 'Gugi',
'quicksand': 'Quicksand',
'quanlai': {
name: 'cjkfonts AllSeto',
provider: 'none',
},
xiaolai: {
'xiaolai': {
name: 'Xiaolai SC',
provider: 'none',
},
'urbanist': 'Urbanist',
'm-plus-rounded': 'M PLUS Rounded 1c',
},
timeouts: {
warning: 5000,