favicon sizes fix

lumeland · Dec 7, 2023 · e23fbdc · e23fbdc
1 parent 67b9501
commit e23fbdc
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 9 deletions.
diff --git a/plugins/favicon.ts b/plugins/favicon.ts
@@ -31,13 +31,13 @@ export const defaults: Options = {
   favicons: [
     {
       url: "/favicon.ico",
-      size: 32,
+      size: [16, 32],
       rel: "icon",
       format: "ico",
     },
     {
       url: "/apple-touch-icon.png",
-      size: 180,
+      size: [180],
       rel: "apple-touch-icon",
       format: "png",
     },
@@ -46,7 +46,7 @@ export const defaults: Options = {
 
 export interface Favicon {
   url: string;
-  size: number;
+  size: number[];
   rel: string;
   format: string;
 }
@@ -128,7 +128,7 @@ export default function (userOptions?: Options) {
         for (const favicon of options.favicons) {
           addIcon(document, {
             rel: favicon.rel,
-            sizes: `${favicon.size}x${favicon.size}`,
+            sizes: favicon.size.map((s) => `${s}x${s}`).join(" "),
             href: site.url(favicon.url),
           });
         }
@@ -149,7 +149,7 @@ function addIcon(document: Document, attributes: Record<string, string>) {
 async function buildIco(
   content: Uint8Array,
   format: keyof sharp.FormatEnum | "ico",
-  size: number,
+  size: number[],
   cache?: Cache,
 ): Promise<Uint8Array> {
   if (cache) {
@@ -166,12 +166,11 @@ async function buildIco(
     const resizeOptions = { background: { r: 0, g: 0, b: 0, alpha: 0 } };
     const img = sharp(content);
     image = await sharpsToIco(
-      img.clone().resize(16, 16, resizeOptions),
-      img.clone().resize(32, 32, resizeOptions),
+      ...size.map((size) => img.clone().resize(size, size, resizeOptions)),
     );
   } else {
     image = await sharp(content)
-      .resize(size, size)
+      .resize(size[0], size[0])
       .toFormat(format)
       .toBuffer();
   }

diff --git a/tests/__snapshots__/favicon.test.ts.snap b/tests/__snapshots__/favicon.test.ts.snap
@@ -197,7 +197,7 @@ snapshot[`favicon plugin 3`] = `
 <html><head>
     <title>Hello world</title>
   <link rel="icon" href="/favicon.svg" type="image/svg+xml">
-<link rel="icon" sizes="32x32" href="/favicon.ico">
+<link rel="icon" sizes="16x16 32x32" href="/favicon.ico">
 <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
 </head>
   <body>