34 lines
825 B
TypeScript
34 lines
825 B
TypeScript
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,
|
|
cssVar = "--font-family"
|
|
): 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(cssVar, font)
|
|
} catch (error) {
|
|
console.warn("error when loading font")
|
|
}
|
|
}
|