chore: icon

Author: Debbl

package.json

@@ -22,6 +22,8 @@
   },
   "devDependencies": {
     "@debbl/eslint-config": "^0.0.53",
+    "@iconify/icons-carbon": "^1.2.20",
+    "@iconify/react": "^4.1.1",
     "@types/node": "18.15.10",
     "@types/react": "18.0.30",
     "@types/react-dom": "18.0.11",

pnpm-lock.yaml

@@ -1,22 +1,15 @@
-import Image from "next/image";
-import GithubIcon from "~/assets/images/github.svg";
-import useMainStore from "~/store/useMainStore";
-import GithubIconDark from "~/assets/images/github-dark.svg";
+import { Icon } from "@iconify/react";
+import logoGithub from "@iconify/icons-carbon/logo-github";
 
 function GitHubInfo() {
-  const theme = useMainStore((s) => (s.theme === "vs-dark" ? "dark" : "light"));
   return (
-    <div className="ml-8 flex h-[16px] w-[16px] justify-center">
+    <div className="ml-8 flex h-[18px] w-[18px] justify-center">
       <a
         href="https://github.com/Debbl/code-diff"
         target="_blank"
         rel="noreferrer"
       >
-        <Image
-          src={theme === "light" ? GithubIcon : GithubIconDark}
-          alt="https://github.com/Debbl/code-diff"
-          unoptimized
-        ></Image>
+        <Icon icon={logoGithub} className="h-[18px] w-[18px]" />
       </a>
     </div>
   );

public/next.svg

@@ -1,7 +1,7 @@
 import type { DiffOnMount, Monaco } from "@monaco-editor/react";
 import { DiffEditor } from "@monaco-editor/react";
 import Head from "next/head";
-import nextConfig from "../../next.config";
+import { basePath } from "../../next.config";
 import useMainStore from "~/store/useMainStore";
 import Header from "~/components/Header";
 import useTheme from "~/hooks/useTheme";
@@ -31,13 +31,15 @@ export default function Index() {
         <title>code-diff</title>
         <link
           rel="shortcut icon"
-          href={`${nextConfig.basePath}/logo.svg`}
+          href={`${basePath}/logo.svg`}
           type="image/x-icon"
         />
       </Head>
-      <div className="flex h-screen flex-col items-center">
-        <h1 className="my-2 text-center text-xl font-medium">Code Diff</h1>
 
+      <div className="flex h-screen flex-col items-center">
+        <h1 className="my-2 cursor-pointer text-center text-xl font-medium">
+          <a href={basePath}>Code Diff</a>
+        </h1>
         <Header />
 
         <main className="h-full w-full">