feat(font): allow font config ; cleanup

.docs/content/1.index.md

@@ -7,7 +7,7 @@ title: About
 
 ::hero
 ---
-image: '/alpine.png'
+image: '/alpine-0.png'
 ---
 #title
 Hi, I am Alpine.
@@ -24,8 +24,8 @@ Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulu
 ::gallery
 ---
 images:
+  - /alpine-0.png
+  - /alpine-1.png
   - /alpine-2.png
-  - /alpine.png
-  - /alpine-3.png
 ---
 ::

.docs/tokens.config.ts

@@ -1,4 +1,7 @@
 import { defineTheme } from 'pinceau'
 
 export default defineTheme({
+  font: {
+    sans: 'Supreme'
+  }
 })

app.config.ts

@@ -9,21 +9,21 @@ export default defineAppConfig({
       height: 300
     },
     header: {
-      position: 'right', // possible value are : | 'left' | 'center' | 'right'
+      position: 'right',
       logo: {
-        path: '/logo.svg', // path of the logo
-        pathDark: '/logo-dark.svg', // path of the logo in dark mode, leave this empty if you want to use the same logo
-        alt: 'alpine' // alt of the logo
+        path: '/logo.svg',
+        pathDark: '/logo-dark.svg',
+        alt: 'alpine'
       }
     },
     footer: {
       credits: {
-        enabled: true, // possible value are : true | false
-        repository: 'https://www.github.com/nuxt-themes/alpine' // our github repository
+        enabled: true,
+        repository: 'https://www.github.com/nuxt-themes/alpine'
       },
-      navigation: true, // possible value are : true | false
-      alignment: 'center', // possible value are : 'none' | 'left' | 'center' | 'right'
-      message: 'Follow me on' // string that will be displayed in the footer (leave empty or delete to disable)
+      navigation: true,
+      alignment: 'center',
+      message: 'Follow me on'
     },
     socials: {
       twitter: 'nuxtlabs',

app.vue

@@ -6,6 +6,6 @@
 
 <style>
 html {
-  font-family: Supreme;
+  font-family: $dt('font.sans');
 }
-</style>
+</style>