GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2025-12-24 21:34:06 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added googleSubFontHref function

Browse Source
This commit is contained in:
Felix Nie 2025-03-17 02:46:11 +08:00
parent c8ae52ee0f
commit 36e6361fa9
3 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
quartz/components/Head.tsx
View File

@ -1,7 +1,7 @@
import { i18n } from "../i18n"
import { FullSlug, getFileExtension, joinSegments, pathToRoot } from "../util/path"
import { CSSResourceToStyleElement, JSResourceToScriptElement } from "../util/resources"
import { googleFontHref } from "../util/theme"
import { googleFontHref, googleSubFontHref } from "../util/theme"
import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"
import { unescapeHTML } from "../util/escape"
import { CustomOgImagesEmitterName } from "../plugins/emitters/ogImage"
@ -45,6 +45,7 @@ export default (() => {
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link rel="stylesheet" href={googleFontHref(cfg.theme)} />
<link rel="stylesheet" href={googleSubFontHref(cfg.theme, cfg.pageTitle)} />
</>
)}
<link rel="preconnect" href="https://cdnjs.cloudflare.com" crossOrigin="anonymous" />

11
quartz/plugins/emitters/componentResources.ts
View File

@ -9,7 +9,7 @@ import styles from "../../styles/custom.scss"
import popoverStyle from "../../components/styles/popover.scss"
import { BuildCtx } from "../../util/ctx"
import { QuartzComponent } from "../../components/types"
import { googleFontHref, joinStyles, processGoogleFonts } from "../../util/theme"
import { googleFontHref, googleSubFontHref, joinStyles, processGoogleFonts } from "../../util/theme"
import { Features, transform } from "lightningcss"
import { transform as transpile } from "esbuild"
import { write } from "./helpers"
@ -215,8 +215,13 @@ export const ComponentResources: QuartzEmitterPlugin = () => {
// let the user do it themselves in css
} else if (cfg.theme.fontOrigin === "googleFonts" && !cfg.theme.cdnCaching) {
// when cdnCaching is true, we link to google fonts in Head.tsx
const response = await fetch(googleFontHref(ctx.cfg.configuration.theme))
googleFontsStyleSheet = await response.text()
const googleFontsResponse = await fetch(googleFontHref(ctx.cfg.configuration.theme))
googleFontsStyleSheet = await googleFontsResponse.text()
const googleSubFontsResponse = await fetch(googleSubFontHref(ctx.cfg.configuration.theme, ctx.cfg.configuration.pageTitle))
const googleSubFontsStyleSheet = await googleSubFontsResponse.text()
googleFontsStyleSheet = `${googleFontsStyleSheet}\n${googleSubFontsStyleSheet}`;
if (!cfg.baseUrl) {
throw new Error(

7
quartz/util/theme.ts
View File

@ -91,6 +91,13 @@ export function googleFontHref(theme: Theme) {
return `https://fonts.googleapis.com/css2?family=${bodyFont}&family=${headerFont}&family=${codeFont}&display=swap`
}
export function googleSubFontHref(theme: Theme, text: string): string {
const { title } = theme.typography;
const titleFont = formatFontSpecification("title", title);
return `https://fonts.googleapis.com/css2?family=${titleFont}&text=${encodeURIComponent(text)}&display=swap`;
}
export interface GoogleFontFile {
url: string
filename: string