deps: use coollabs instead of google fonts

src/utils/downloadFont.ts

@@ -0,0 +1,30 @@
+import FontFaceObserver from "fontfaceobserver"
+
+const assembleFontLink = (font: string) => {
+  return `https://api.fonts.coollabs.io/css2?display=swap&family=${font
+    .replaceAll(",", "&family=")
+    .replaceAll(" ", "+")}`
+}
+
+export const downloadFont = async (font: string): Promise<void> => {
+  const href = assembleFontLink(font)
+
+  // check if the href already exists
+  const existingLink = document.querySelector(`link[href="${href}"]`)
+
+  if (!existingLink) {
+    const link = document.createElement("link")
+    link.href = href
+    link.rel = "stylesheet"
+
+    document.head.appendChild(link)
+  }
+
+  try {
+    await new FontFaceObserver(font).load()
+
+    document.documentElement.style.setProperty("--font-family", font)
+  } catch (error) {
+    console.warn("error when loading font")
+  }
+}