feat: allow user to customize favicon (#47)

* feat: add basic custom favicon feature

* add auto-switch icon

* revert to the original setting `false`
This commit is contained in:
Joey Chen 2024-04-23 00:52:45 +08:00 committed by saica.go
parent 582e76cf43
commit bd468054c2
3 changed files with 21 additions and 1 deletions

View File

@ -15,6 +15,14 @@ export const siteConfig: SiteConfig = {
enable: false,
src: 'assets/images/demo-banner.png',
},
favicon: {
enable: false,
size: '32x32',
src: {
light: '/favicon/favicon-light-32.png',
dark: '/favicon/favicon-dark-32.png',
}
},
}
export const navBarConfig: NavBarConfig = {

View File

@ -54,6 +54,7 @@ if (!banner || typeof banner !== 'string' || banner.trim() === '') {
banner = siteConfig.banner.src;
const enableBanner = siteConfig.banner.enable;
const enableFavicon = siteConfig.favicon.enable;
let pageTitle;
if (title) {
@ -74,6 +75,8 @@ if (title) {
<meta name="description" content={description || pageTitle}>
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
{enableFavicon ? <link rel="icon" media="(prefers-color-scheme: light)" href={siteConfig.favicon.src.light} sizes={siteConfig.favicon.size}>
<link rel="icon" media="(prefers-color-scheme: dark)" href={siteConfig.favicon.src.dark}> :
<link rel="icon" media="(prefers-color-scheme: light)" href="/favicon/favicon-light-32.png" sizes="32x32">
<link rel="icon" media="(prefers-color-scheme: light)" href="/favicon/favicon-light-128.png" sizes="128x128">
<link rel="icon" media="(prefers-color-scheme: light)" href="/favicon/favicon-light-180.png" sizes="180x180">
@ -81,7 +84,7 @@ if (title) {
<link rel="icon" media="(prefers-color-scheme: dark)" href="/favicon/favicon-dark-32.png" sizes="32x32">
<link rel="icon" media="(prefers-color-scheme: dark)" href="/favicon/favicon-dark-128.png" sizes="128x128">
<link rel="icon" media="(prefers-color-scheme: dark)" href="/favicon/favicon-dark-180.png" sizes="180x180">
<link rel="icon" media="(prefers-color-scheme: dark)" href="/favicon/favicon-dark-192.png" sizes="192x192">
<link rel="icon" media="(prefers-color-scheme: dark)" href="/favicon/favicon-dark-192.png" sizes="192x192">}
<link rel="stylesheet" href="https://cdn.staticfile.org/KaTeX/0.16.9/katex.min.css" integrity="sha384-n8MVd4RsNIU0tAv4ct0nTaAbDJwPJzDEaqSD1odI+WdtXRGWt2kTvGFasHpSy3SV" crossorigin="anonymous">

View File

@ -9,6 +9,15 @@ export type SiteConfig = {
enable: boolean
src: string
}
favicon: {
enable: boolean
size: string
src: {
light: string
dark: string
}
}
}
export enum LinkPreset {