search

trevortylerlee / astro-micro

Blog theme for Astro with search and comments built-in. Zero frameworks.
https://astro-micro.vercel.app
MIT License
150 stars 37 forks source link

Tailwind CSS font-weights aren't imported correctly #55

Closed trevortylerlee closed 3 hours ago

trevortylerlee commented 3 hours ago

I discovered that this PR breaks e.g. Tailwind CSS directives such as font-bold and font-extrabold.

The culprit seems to be the new imports in Head.astro, which apparently end up only including the 400 weight:

import "@fontsource/geist-sans";
import "@fontsource/geist-mono";

In my setup, I fixed this problem by including all weights, as described at https://fontsource.org/fonts/geist-sans/install and https://fontsource.org/fonts/geist-mono/install.

import "@fontsource/geist-sans/100.css";
import "@fontsource/geist-sans/200.css";
import "@fontsource/geist-sans/300.css";
import "@fontsource/geist-sans/400.css";
import "@fontsource/geist-sans/500.css";
import "@fontsource/geist-sans/600.css";
import "@fontsource/geist-sans/700.css";
import "@fontsource/geist-sans/800.css";
import "@fontsource/geist-sans/900.css";
import "@fontsource/geist-mono/100.css";
import "@fontsource/geist-mono/200.css";
import "@fontsource/geist-mono/300.css";
import "@fontsource/geist-mono/400.css";
import "@fontsource/geist-mono/500.css";
import "@fontsource/geist-mono/600.css";
import "@fontsource/geist-mono/700.css";
import "@fontsource/geist-mono/800.css";
import "@fontsource/geist-mono/900.css";

Originally posted by @miguno in https://github.com/trevortylerlee/astro-micro/issues/35#issuecomment-2359306565

miguno commented 3 hours ago

Thank you, @trevortylerlee !