feat: use fontaine for font metrict generation

johannschopplich · Jul 4, 2024 · 21ac0f9 · 21ac0f9
1 parent 7bf046f
commit 21ac0f9
Show file tree

Hide file tree

Showing 9 changed files with 132 additions and 68 deletions.
diff --git a/app/assets/css/main.css b/app/assets/css/main.css
@@ -1,3 +1,19 @@
+@font-face {
+  font-family: 'Cooper Hewitt';
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+  src: url('/fonts/CooperHewitt-400.woff2') format('woff2');
+}
+
+@font-face {
+  font-family: 'Cooper Hewitt';
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+  src: url('/fonts/CooperHewitt-700.woff2') format('woff2');
+}
+
 :root {
   --un-decoration-thickness: max(1px, 0.05em);
   --un-decoration-offset: max(2px, 0.15em);

diff --git a/app/assets/css/prose.css b/app/assets/css/prose.css
@@ -179,9 +179,7 @@
  * Custom styles
  */
 .prose :where(h1, h2, h3, h4, h5, h6):not(:where(.not-prose, .not-prose *)) {
-  font-family:
-    Cooper Hewitt,
-    sans-serif;
+  font-family: Cooper Hewitt;
   font-size: 1em;
 }
 

diff --git a/app/assets/uno.css b/app/assets/uno.css
diff --git a/nuxt.config.ts b/nuxt.config.ts
@@ -5,7 +5,7 @@ const isDev = process.env.NODE_ENV === 'development'
 export default defineNuxtConfig({
   modules: [
     '@byjohann/ui/nuxt',
-    '@nuxt/fonts',
+    '@nuxtjs/fontaine',
     '@unocss/nuxt',
     '@vueuse/nuxt',
     'nuxt-vitalizer',
@@ -50,18 +50,6 @@ export default defineNuxtConfig({
     disableNuxtInlineStyle: false,
   },
 
-  fonts: {
-    families: [
-      {
-        provider: 'local',
-        name: 'Cooper Hewitt',
-        weights: [400, 700],
-        styles: ['normal'],
-        global: true,
-      },
-    ],
-  },
-
   nitro: {
     storage: {
       kql:

diff --git a/package.json b/package.json
@@ -23,7 +23,7 @@
     "@iconify-json/carbon": "^1.1.35",
     "@iconify-json/logos": "^1.1.43",
     "@julr/unocss-preset-forms": "^0.1.0",
-    "@nuxt/fonts": "^0.7.0",
+    "@nuxtjs/fontaine": "^0.4.3",
     "@sindresorhus/slugify": "^2.2.1",
     "@types/node": "^20.14.5",
     "@unocss/eslint-config": "^0.61.0",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/public/fonts/CooperHewitt.woff2 → public/fonts/CooperHewitt-400.woff2 b/public/fonts/CooperHewitt.woff2 → public/fonts/CooperHewitt-400.woff2
diff --git a/public/fonts/CooperHewitt-Bold.woff2 → public/fonts/CooperHewitt-700.woff2 b/public/fonts/CooperHewitt-Bold.woff2 → public/fonts/CooperHewitt-700.woff2
diff --git a/uno.config.ts b/uno.config.ts
@@ -45,7 +45,7 @@ export default defineConfig<Theme>({
       },
     },
     fontFamily: {
-      heading: 'Cooper Hewitt, sans-serif',
+      heading: 'Cooper Hewitt',
     },
   },
   shortcuts: {