astro.config.mjs

@@ -1,7 +1,6 @@
 // @ts-check
 import { readdirSync, readFileSync } from 'node:fs';
 import { defineConfig } from 'astro/config';
-import { defineConfig, fontProviders } from 'astro/config';
 
 import react from '@astrojs/react';
 import mdx from '@astrojs/mdx';
@@ -54,27 +53,10 @@ export default defineConfig({
   integrations: [react(), mdx(), sitemap({ filter: (page) => !DRAFT_PATHS.some((path) => page.endsWith(path)) })],
 
   adapter: vercel({
-    webAnalytics: { enabled: false },
+    webAnalytics: { enabled: true },
   }),
 
   vite: {
     plugins: [tailwindcss()],
   },
-
-  fonts: [
-    {
-      provider: fontProviders.local(),
-      name: "iA Writer Duo S",
-      cssVariable: "--font-iawriter",
-      options: {
-        variants: [
-          {
-            src: ['./src/assets/iAWriterDuoS-Regular.woff2'],
-            weight: 'normal',
-            style: 'normal'
-          }
-        ]
-      }
-    }
-  ]
 });

src/components/PostCard.astro

@@ -13,7 +13,7 @@ const href = getLocalizedPath(`/posts/${slugOf(post)}`, lang);
 const tagsHref = (tag: string) => getLocalizedPath(`/tags/${tag}`, lang);
 ---
 
-<article class="group border-b border-border py-6 first:pt-0 last:border-b-0 font-prose">
+<article class="group border-b border-border py-6 first:pt-0 last:border-b-0 font-mono">
   <a href={href} class="block">
     <time datetime={post.data.pubDate.toISOString()} class="text-xs font-medium uppercase tracking-wide text-text-muted">
       {formatDate(post.data.pubDate, lang)}

src/layouts/BaseLayout.astro

@@ -1,6 +1,5 @@
 ---
 import { existsSync } from 'node:fs';
-import { Font } from 'astro:assets';
 import '../styles/global.css';
 import Header from '../components/Header.astro';
 import Footer from '../components/Footer.astro';
@@ -60,8 +59,12 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
     <meta name="twitter:description" content={description} />
     <meta name="twitter:image" content={new URL(image, Astro.site)} />
 
-    <Font cssVariable="--font-iawriter" preload />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
-
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,400..700;1,400..700&family=JetBrains+Mono:wght@400;500;600&display=swap"
+      rel="stylesheet"
+    />
 
     <script
       is:inline

src/layouts/PostLayout.astro

@@ -15,7 +15,7 @@ const postsHref = getLocalizedPath('/posts', lang);
 const tagsHref = (tag: string) => getLocalizedPath(`/tags/${tag}`, lang);
 ---
 
-<article class="mx-10 my-10 font-prose">
+<article class="mx-10 my-10 font-mono">
   <a href={postsHref} class="underline inline-flex items-center gap-1.5 text-sm font-medium text-text-muted hover:text-primary">
     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="size-4">
       <path d="M15 18l-6-6 6-6"></path>
@@ -35,7 +35,7 @@ const tagsHref = (tag: string) => getLocalizedPath(`/tags/${tag}`, lang);
         </>
       )}
     </div>
-    <h1 class="mt-3 text-3xl leading-11 font-bold tracking-tight text-text sm:text-4xl">{post.data.title}</h1>
+    <h1 class="mt-3 text-3xl font-bold tracking-tight text-text sm:text-4xl">{post.data.title}</h1>
     <p class="mt-3 text-lg text-text-muted">{post.data.description}</p>
     {post.data.tags.length > 0 && (
       <div class="mt-4 flex flex-wrap gap-2">

src/styles/global.css

@@ -6,8 +6,7 @@
 
 @theme inline {
   --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
-  --font-prose: var(--font-iawriter), ui-monospace, SFMono-Regular, Menlo, monospace;
+  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
-  --font-mono: var(--font-iawriter), ui-monospace, SFMono-Regular, Menlo, monospace;
 
   --color-bg: var(--bg);
   --color-surface: var(--surface);