fix: format

Author: iamStephenFang

.github/workflows/deploy.yml

@@ -4,7 +4,7 @@ on:
   # Trigger the workflow every time you push to the `main` branch
   # Using a different branch name? Replace `main` with your branch’s name
   push:
-    branches: [ master ]
+    branches: [master]
   # Allows you to run this workflow manually from the Actions tab on GitHub.
   workflow_dispatch:
 
@@ -17,27 +17,15 @@ permissions:
 jobs:
   build:
     runs-on: ubuntu-latest
-    timeout-minutes: 3
-
-    strategy:
-      matrix:
-        node-version: [18.x]
-
     steps:
       - name: Checkout your repository using git
         uses: actions/checkout@v4
-
-      - name: "🔧 Setup Node.js ${{ matrix.node-version }}"
-        uses: actions/setup-node@v4
-        with:
-          node-version: ${{ matrix.node-version }}
-          cache: "npm"
-
-      - name: "📦 Install dependencies"
-        run: npm ci
-
-      - name: "🚀 Build the project"
-        run: npm run build
+      - name: Install, build, and upload your site
+        uses: withastro/action@v3
+        # with:
+        # path: . # The root location of your Astro project inside the repository. (optional)
+        # node-version: 20 # The specific version of Node that should be used to build your site. Defaults to 20. (optional)
+        # package-manager: pnpm@latest # The Node package manager that should be used to install dependencies and build your site. Automatically detected based on your lockfile. (optional)
 
   deploy:
     needs: build
@@ -48,4 +36,4 @@ jobs:
     steps:
       - name: Deploy to GitHub Pages
         id: deployment
-        uses: actions/deploy-pages@v4
+        uses: actions/deploy-pages@v4

README.md

@@ -1,6 +1,5 @@
 # stephenfang.me
 
-
 ## 🚀 项目介绍
 
 使用 [Astro](https://astro.build/) 与 [AstroPaper 📄](https://github.com/satnaing/astro-paper) 搭建的个人主页，是我个人的第一个产品。
@@ -12,23 +11,22 @@
 - 2022-09-20: v1.1.0 更新了阅读数量、时长等多项功能
 - 2020-09-07: v1.0.0 使用 Hexo 与 NexT 主题搭建
 
-
 ## 💻 搭建技术
 
-- [Astro](https://astro.build/)  
-- [TypeScript](https://www.typescriptlang.org/)  
-- [ReactJS](https://reactjs.org/)  
-- [TailwindCSS](https://tailwindcss.com/)  
+- [Astro](https://astro.build/)
+- [TypeScript](https://www.typescriptlang.org/)
+- [ReactJS](https://reactjs.org/)
+- [TailwindCSS](https://tailwindcss.com/)
 - [GitHub Pages](https://pages.github.com/)
 
 ## ✨ 内容链接
 
 网站已经部署在 [stephenfang.me](https://stephenfang.me)。
 
 ## 📜 License
+
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
 ---
 
 Made with 🤍 by [StephenFang](https://github.com/iamStephenFang) in Hangzhou.
-

src/components/Comments.tsx

@@ -3,49 +3,49 @@ import { GISCUS } from "@config";
 import { useEffect, useState } from "react";
 
 interface CommentsProps {
-    lightTheme?: Theme;
-    darkTheme?: Theme;
+  lightTheme?: Theme;
+  darkTheme?: Theme;
 }
 
 export default function Comments({
-    lightTheme = "light",
-    darkTheme = "dark",
+  lightTheme = "light",
+  darkTheme = "dark",
 }: CommentsProps) {
-    const [theme, setTheme] = useState(() => {
-        const currentTheme = localStorage.getItem("theme");
-        const browserTheme = window.matchMedia("(prefers-color-scheme: dark)")
-            .matches
-            ? "dark"
-            : "light";
-
-        return currentTheme || browserTheme;
-    });
-
-    useEffect(() => {
-        const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-        const handleChange = ({ matches }: MediaQueryListEvent) => {
-            setTheme(matches ? "dark" : "light");
-        };
-
-        mediaQuery.addEventListener("change", handleChange);
-
-        return () => mediaQuery.removeEventListener("change", handleChange);
-    }, []);
-
-    useEffect(() => {
-        const themeButton = document.querySelector("#theme-btn");
-        const handleClick = () => {
-            setTheme(prevTheme => (prevTheme === "dark" ? "light" : "dark"));
-        };
-
-        themeButton?.addEventListener("click", handleClick);
-
-        return () => themeButton?.removeEventListener("click", handleClick);
-    }, []);
-
-    return (
-        <div className="mt-8">
-            <Giscus theme={theme === "light" ? lightTheme : darkTheme} {...GISCUS} />
-        </div>
-    );
+  const [theme, setTheme] = useState(() => {
+    const currentTheme = localStorage.getItem("theme");
+    const browserTheme = window.matchMedia("(prefers-color-scheme: dark)")
+      .matches
+      ? "dark"
+      : "light";
+
+    return currentTheme || browserTheme;
+  });
+
+  useEffect(() => {
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    const handleChange = ({ matches }: MediaQueryListEvent) => {
+      setTheme(matches ? "dark" : "light");
+    };
+
+    mediaQuery.addEventListener("change", handleChange);
+
+    return () => mediaQuery.removeEventListener("change", handleChange);
+  }, []);
+
+  useEffect(() => {
+    const themeButton = document.querySelector("#theme-btn");
+    const handleClick = () => {
+      setTheme(prevTheme => (prevTheme === "dark" ? "light" : "dark"));
+    };
+
+    themeButton?.addEventListener("click", handleClick);
+
+    return () => themeButton?.removeEventListener("click", handleClick);
+  }, []);
+
+  return (
+    <div className="mt-8">
+      <Giscus theme={theme === "light" ? lightTheme : darkTheme} {...GISCUS} />
+    </div>
+  );
 }