| | |
|---|
| | | secondary: string |
|---|
| | | tertiary: string |
|---|
| | | highlight: string |
|---|
| | | textHighlight: string |
|---|
| | | } |
|---|
| | | |
|---|
| | | interface Colors { |
|---|
| | |
|---|
| | | } |
|---|
| | | 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 googleFontHref(theme: Theme) { |
|---|
| | |
|---|
| | | --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}; |
|---|
| | |
|---|
| | | --secondary: ${theme.colors.darkMode.secondary}; |
|---|
| | | --tertiary: ${theme.colors.darkMode.tertiary}; |
|---|
| | | --highlight: ${theme.colors.darkMode.highlight}; |
|---|
| | | --textHighlight: ${theme.colors.darkMode.textHighlight}; |
|---|
| | | } |
|---|
| | | ` |
|---|
| | | } |
|---|
