Fixing favicon

Author: jayair

docs/components/Layout.tsx

@@ -9,7 +9,16 @@ export default function Layout({ children }: { children: React.ReactNode }) {
         <title key="title">{SITE.title}</title>
         <meta name="viewport" content="initial-scale=1.0, width=device-width" />
         <meta key="description" name="description" content={SITE.description} />
-        <link rel="icon" href="/favicon.svg" />
+        <link
+          href="favicon-light.png"
+          rel="icon"
+          media="(prefers-color-scheme: light)"
+        />
+        <link
+          href="favicon-dark.png"
+          rel="icon"
+          media="(prefers-color-scheme: dark)"
+        />
         <meta property="og:image" content="/share.png" />
       </Head>
       <main className={styles.main}>{children}</main>