refactor：增加首页图标

Author: yyyCode

vue/index.html

@@ -16,11 +16,13 @@
     </script>
     <!--
       网站图标：把文件放在 frontend/public/ 下（打包后对应网站根路径 /）。
-      默认使用 site-icon.png。若要用 ICO，可把图片命名为 favicon.ico 放到 public/，
-      并把下面第一行 href 改为 "/favicon.ico"、type 改为 "image/x-icon"。
+      默认使用 favicon.svg（矢量图，任意尺寸都清晰）。
+      若要用 PNG，可把图片命名为 site-icon.png 放到 public/，
+      并把下面第一行 href 改为 "/site-icon.png"、type 改为 "image/png"。
     -->
-    <link rel="icon" href="/site-icon.png" type="image/png" sizes="any" />
-    <link rel="apple-touch-icon" href="/site-icon.png" />
+    <link rel="icon" href="/site-icon.png" type="image/png" sizes="32x32" />
+    <link rel="icon" href="/site-icon.png" type="image/png" sizes="128x128" />
+    <link rel="apple-touch-icon" href="/site-icon.png" sizes="180x180" />
     <link rel="preconnect" href="https://fastly.jsdelivr.net" crossorigin />
     <link rel="dns-prefetch" href="https://fastly.jsdelivr.net" />
     <link rel="preconnect" href="https://v1.hitokoto.cn" crossorigin />

vue/public/favicon.ico

@@ -1876,12 +1876,13 @@ body {
 }
 
 .site-brand-logo {
-  width: 22px;
-  height: 22px;
+  width: 62px;
+  height: 62px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
+  border-radius: 6px;
   color: var(--accent);
 }
 

vue/public/favicon.svg

@@ -2,6 +2,7 @@
   <header class="site-top-bar" role="banner">
     <div class="site-top-bar-inner">
       <router-link to="/" class="site-brand" aria-label="返回首页">
+        <img class="site-brand-logo" src="/site-icon.png" alt="" aria-hidden="true" />
         <span class="site-brand-text">{{ (siteConfig && siteConfig.blog_name) || '烧仙草冰室' }}</span>
       </router-link>