personal site
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: fonts

serenity f1c39936 c2a8f9e8

+52 -20
+23 -6
astro.config.mjs
··· 1 1 // @ts-check 2 - import { defineConfig } from 'astro/config'; 2 + import { defineConfig, fontProviders } from "astro/config"; 3 3 4 - import tailwindcss from '@tailwindcss/vite'; 4 + import tailwindcss from "@tailwindcss/vite"; 5 5 6 6 // https://astro.build/config 7 7 export default defineConfig({ 8 - vite: { 9 - plugins: [tailwindcss()] 10 - } 11 - }); 8 + vite: { 9 + plugins: [tailwindcss()] 10 + }, 11 + fonts: [ 12 + { 13 + provider: fontProviders.fontsource(), 14 + name: "Hanken Grotesk", 15 + cssVariable: "--font-hanken-grotesk" 16 + }, 17 + { 18 + provider: fontProviders.fontsource(), 19 + name: "Amiri", 20 + cssVariable: "--font-amiri" 21 + }, 22 + { 23 + provider: fontProviders.fontsource(), 24 + name: "Maple Mono", 25 + cssVariable: "--font-maple-mono" 26 + } 27 + ] 28 + });
+24
src/layouts/RootLayout.astro
··· 1 + --- 2 + import { Font } from "astro:assets"; 3 + import "../styles/global.css"; 4 + const { title } = Astro.props; 5 + --- 6 + 7 + <html lang="en"> 8 + <head> 9 + <meta charset="utf-8" /> 10 + <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> 11 + <link rel="icon" href="/favicon.ico" /> 12 + <meta name="viewport" content="width=device-width" /> 13 + <meta name="generator" content={Astro.generator} /> 14 + <Font cssVariable="--font-maple-mono" /> 15 + <Font cssVariable="--font-hanken-grotesk" /> 16 + <Font cssVariable="--font-amiri" /> 17 + <title>{title}</title> 18 + </head> 19 + <body 20 + class="bg-glw-base text-glw-text flex w-screen items-center justify-center" 21 + > 22 + <slot /> 23 + </body> 24 + </html>
+5 -14
src/pages/index.astro
··· 1 1 --- 2 - 2 + import "../styles/global.css"; 3 + import RootLayout from "../layouts/RootLayout.astro"; 3 4 --- 4 5 5 - <html lang="en"> 6 - <head> 7 - <meta charset="utf-8" /> 8 - <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> 9 - <link rel="icon" href="/favicon.ico" /> 10 - <meta name="viewport" content="width=device-width" /> 11 - <meta name="generator" content={Astro.generator} /> 12 - <title>Astro</title> 13 - </head> 14 - <body> 15 - <h1>Astro</h1> 16 - </body> 17 - </html> 6 + <RootLayout title="Goldweaver's Abode"> 7 + <h1>Astro</h1> 8 + </RootLayout>