feat: add favicon

biblys · Jan 14, 2025 · ad07b50 · ad07b50
1 parent ac0ddc0
commit ad07b50
Show file tree

Hide file tree

Showing 8 changed files with 28 additions and 2 deletions.
diff --git a/public/favicon/apple-touch-icon.png b/public/favicon/apple-touch-icon.png
diff --git a/public/favicon/favicon-96x96.png b/public/favicon/favicon-96x96.png
diff --git a/public/favicon/favicon.ico b/public/favicon/favicon.ico
diff --git a/public/favicon/favicon.svg b/public/favicon/favicon.svg
diff --git a/public/favicon/site.webmanifest b/public/favicon/site.webmanifest
@@ -0,0 +1,21 @@
+{
+  "name": "MyWebSite",
+  "short_name": "MySite",
+  "icons": [
+    {
+      "src": "/favicon/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "maskable"
+    },
+    {
+      "src": "/favicon/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}
diff --git a/public/favicon/web-app-manifest-192x192.png b/public/favicon/web-app-manifest-192x192.png
diff --git a/public/favicon/web-app-manifest-512x512.png b/public/favicon/web-app-manifest-512x512.png
diff --git a/src/layouts/Base.astro b/src/layouts/Base.astro
@@ -43,8 +43,12 @@ const { title, meta_title, description, image, noindex, canonical } =
 <!doctype html>
 <html lang="en">
   <head>
-    <!-- favicon -->
-    <link rel="shortcut icon" href={config.site.favicon} />
+    <link rel="icon" type="image/png" href="/favicon/favicon-96x96.png" sizes="96x96" />
+    <link rel="icon" type="image/svg+xml" href="/favicon/favicon.svg" />
+    <link rel="shortcut icon" href="/favicon/favicon.ico" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png" />
+    <link rel="manifest" href="/favicon/site.webmanifest" />
+
     <!-- theme meta -->
     <meta name="theme-name" content="bookworm-light-astro" />
     <meta name="msapplication-TileColor" content="#000000" />