feat: add full favicon support
This commit is contained in:
parent
c50855a5de
commit
9590e739b0
8 changed files with 44 additions and 10 deletions
BIN
src/assets/favicon.png
Normal file
BIN
src/assets/favicon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 350 KiB |
2
src/assets/favicon.svg
Normal file
2
src/assets/favicon.svg
Normal file
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 18 KiB |
|
@ -1,4 +1,15 @@
|
|||
---
|
||||
import Favicon from "../../../assets/favicon.png";
|
||||
import FaviconSvg from '../../../assets/favicon.svg';
|
||||
import {getImage} from "astro:assets";
|
||||
|
||||
const appleTouchIcon = await getImage({
|
||||
src: Favicon,
|
||||
width: 180,
|
||||
height: 180,
|
||||
format: 'png'
|
||||
})
|
||||
|
||||
interface Props {
|
||||
title: string;
|
||||
description: string;
|
||||
|
@ -13,6 +24,11 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
|
|||
<meta name="title" content={title} />
|
||||
{author && <meta name="author" content={author} />}
|
||||
<meta name="description" content={description} />
|
||||
{/* PWA */}
|
||||
<link rel="icon" href="/favicon.ico" sizes="32x32" />
|
||||
<link rel="icon" href={FaviconSvg.src} type="image/svg+xml" />
|
||||
<link rel="apple-touch-icon" href={appleTouchIcon.src} />
|
||||
<link rel="manifest" href="/manifest.json" />
|
||||
{/* Open Graph / Facebook */}
|
||||
<meta name="og:title" content={title} />
|
||||
<meta name="og:description" content={description} />
|
||||
|
|
|
@ -39,7 +39,6 @@ const { title = pageTitle, author = siteConfig.defaultAuthor.name,description =
|
|||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<Meta title={pageTitle} author={author} description={description} ogImage={ogImage} />
|
||||
<title>{pageTitle}</title>
|
||||
|
|
17
src/pages/favicon.ico.js
Normal file
17
src/pages/favicon.ico.js
Normal file
|
@ -0,0 +1,17 @@
|
|||
import sharp from 'sharp'
|
||||
import ico from 'ico-endec'
|
||||
import path from 'node:path'
|
||||
|
||||
// relative to project root
|
||||
const faviconSrc = path.resolve('src/assets/favicon.svg')
|
||||
|
||||
export const GET = async () => {
|
||||
// resize to 32px PNG
|
||||
const buffer = await sharp(faviconSrc).resize(32).toFormat('png').toBuffer()
|
||||
// generate ico
|
||||
const icoBuffer = ico.encode([buffer])
|
||||
|
||||
return new Response(icoBuffer, {
|
||||
headers: { 'Content-Type': 'image/x-icon' }
|
||||
})
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue