From c538c151c7462ad0395ff2c15c5e11e89e362aa8 Mon Sep 17 00:00:00 2001
From: Striven <sg.striven@cutecat.club>
Date: Sat, 04 Apr 2026 19:47:16 +0000
Subject: [PATCH] Initial commit

---
 quartz/util/theme.ts |  126 +++++++++++++++++++++++++++++++++++++++---
 1 files changed, 117 insertions(+), 9 deletions(-)

diff --git a/quartz/util/theme.ts b/quartz/util/theme.ts
index 49cc9cc..ff4453b 100644
--- a/quartz/util/theme.ts
+++ b/quartz/util/theme.ts
@@ -7,6 +7,7 @@
   secondary: string
   tertiary: string
   highlight: string
+  textHighlight: string
 }
 
 interface Colors {
@@ -14,25 +15,129 @@
   darkMode: ColorScheme
 }
 
+export type FontSpecification =
+  | string
+  | {
+      name: string
+      weights?: number[]
+      includeItalic?: boolean
+    }
+
 export interface Theme {
   typography: {
-    header: string
-    body: string
-    code: string
+    title?: FontSpecification
+    header: FontSpecification
+    body: FontSpecification
+    code: FontSpecification
   }
   cdnCaching: boolean
   colors: Colors
+  fontOrigin: "googleFonts" | "local"
 }
 
 export type ThemeKey = keyof Colors
 
 const DEFAULT_SANS_SERIF =
-  '-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif'
+  'system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"'
 const DEFAULT_MONO = "ui-monospace, SFMono-Regular, SF Mono, Menlo, monospace"
 
+export function getFontSpecificationName(spec: FontSpecification): string {
+  if (typeof spec === "string") {
+    return spec
+  }
+
+  return spec.name
+}
+
+function formatFontSpecification(
+  type: "title" | "header" | "body" | "code",
+  spec: FontSpecification,
+) {
+  if (typeof spec === "string") {
+    spec = { name: spec }
+  }
+
+  const defaultIncludeWeights = type === "header" ? [400, 700] : [400, 600]
+  const defaultIncludeItalic = type === "body"
+  const weights = spec.weights ?? defaultIncludeWeights
+  const italic = spec.includeItalic ?? defaultIncludeItalic
+
+  const features: string[] = []
+  if (italic) {
+    features.push("ital")
+  }
+
+  if (weights.length > 1) {
+    const weightSpec = italic
+      ? weights
+          .flatMap((w) => [`0,${w}`, `1,${w}`])
+          .sort()
+          .join(";")
+      : weights.join(";")
+
+    features.push(`wght@${weightSpec}`)
+  }
+
+  if (features.length > 0) {
+    return `${spec.name}:${features.join(",")}`
+  }
+
+  return spec.name
+}
+
 export function googleFontHref(theme: Theme) {
-  const { code, header, body } = theme.typography
-  return `https://fonts.googleapis.com/css2?family=${code}&family=${header}:wght@400;700&family=${body}:ital,wght@0,400;0,600;1,400;1,600&display=swap`
+  const { header, body, code } = theme.typography
+  const headerFont = formatFontSpecification("header", header)
+  const bodyFont = formatFontSpecification("body", body)
+  const codeFont = formatFontSpecification("code", code)
+
+  return `https://fonts.googleapis.com/css2?family=${headerFont}&family=${bodyFont}&family=${codeFont}&display=swap`
+}
+
+export function googleFontSubsetHref(theme: Theme, text: string) {
+  const title = theme.typography.title || theme.typography.header
+  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
+  extension: string
+}
+
+const fontMimeMap: Record<string, string> = {
+  truetype: "ttf",
+  woff: "woff",
+  woff2: "woff2",
+  opentype: "otf",
+}
+
+export async function processGoogleFonts(
+  stylesheet: string,
+  baseUrl: string,
+): Promise<{
+  processedStylesheet: string
+  fontFiles: GoogleFontFile[]
+}> {
+  const fontSourceRegex =
+    /url\((https:\/\/fonts.gstatic.com\/.+(?:\/|(?:kit=))(.+?)[.&].+?)\)\sformat\('(\w+?)'\);/g
+  const fontFiles: GoogleFontFile[] = []
+  let processedStylesheet = stylesheet
+
+  let match
+  while ((match = fontSourceRegex.exec(stylesheet)) !== null) {
+    const url = match[1]
+    const filename = match[2]
+    const extension = fontMimeMap[match[3].toLowerCase()]
+    const staticUrl = `https://${baseUrl}/static/fonts/${filename}.${extension}`
+
+    processedStylesheet = processedStylesheet.replace(url, staticUrl)
+    fontFiles.push({ url, filename, extension })
+  }
+
+  return { processedStylesheet, fontFiles }
 }
 
 export function joinStyles(theme: Theme, ...stylesheet: string[]) {
@@ -48,10 +153,12 @@
   --secondary: ${theme.colors.lightMode.secondary};
   --tertiary: ${theme.colors.lightMode.tertiary};
   --highlight: ${theme.colors.lightMode.highlight};
+  --textHighlight: ${theme.colors.lightMode.textHighlight};
 
-  --headerFont: "${theme.typography.header}", ${DEFAULT_SANS_SERIF};
-  --bodyFont: "${theme.typography.body}", ${DEFAULT_SANS_SERIF};
-  --codeFont: "${theme.typography.code}", ${DEFAULT_MONO};
+  --titleFont: "${getFontSpecificationName(theme.typography.title || theme.typography.header)}", ${DEFAULT_SANS_SERIF};
+  --headerFont: "${getFontSpecificationName(theme.typography.header)}", ${DEFAULT_SANS_SERIF};
+  --bodyFont: "${getFontSpecificationName(theme.typography.body)}", ${DEFAULT_SANS_SERIF};
+  --codeFont: "${getFontSpecificationName(theme.typography.code)}", ${DEFAULT_MONO};
 }
 
 :root[saved-theme="dark"] {
@@ -63,6 +170,7 @@
   --secondary: ${theme.colors.darkMode.secondary};
   --tertiary: ${theme.colors.darkMode.tertiary};
   --highlight: ${theme.colors.darkMode.highlight};
+  --textHighlight: ${theme.colors.darkMode.textHighlight};
 }
 `
 }

--
Gitblit v1.10.0