Optimize the workflow log page style

perf action step container
Fix fixed height when scrolling through step titles on workflow detail pages
2026-04-13 23:11:37 +08:00 · 2025-11-06 19:24:51 +08:00 · 2025-11-06 18:05:12 +08:00 · 2025-11-06 17:43:10 +08:00 · 2025-11-06 17:36:09 +08:00 · 2025-11-06 10:18:45 +08:00
38 changed files with 784 additions and 546 deletions
--- a/.github/ISSUE_TEMPLATE/1-style-bug-report.yml
+++ b/.github/ISSUE_TEMPLATE/1-style-bug-report.yml
@@ -1,91 +1,90 @@
-name: 样式错误报告 ( Style bug report )
-description: 安装主题后出现颜色/位置错误等 ( Color/position errors occur after installing the theme )
+name: Style bug report
+description: Color/position errors occur after installing the theme.
 labels: ["style bug"]
 body:
  - type: markdown
    attributes:
      value: |
-        1. 请使用最新的主题, 并使用 Ctrl+F5 刷新页面查看 Bug 是否消失 ( Please use the latest theme and refresh the page with Ctrl+F5 to see if the Bug has disappeared )
-        2. 请查看项目根目录下的 CHANGELOG.md 文件, 查看是否有修复该 Bug 的相关描述 ( Please check the CHANGELOG.md file in the project root directory for descriptions of fixes related to this Bug )
-        3. 如果有相关描述, 可以查看 README.md 自己编译开发版本是否修复了该 Bug ( If there are related descriptions, you can check if the Bug has been fixed by compiling the development version yourself in the README.md )
-        4. 请查看 Gitea 默认主题下是否有同样的错误, 确认非主题问题 ( Please check if there is the same error in the default Gitea theme, confirming that it is not a theme problem )
+        1. Please use the latest theme and refresh the page with Ctrl+F5 to see if the Bug has disappeared.
+        2. Please check the CHANGELOG.md file in the project root directory for descriptions of fixes related to this Bug.
+        3. If there are related descriptions, you can check if the Bug has been fixed by compiling the development version yourself in the README.md.
+        4. Please check if there is the same error in the default Gitea theme, confirming that it is not a theme problem.
  - type: input
    id: theme-version
    attributes:
-      label: 主题版本 ( Theme Version )
+      label: Theme Version
      description:
-        主题的版本, 如果是开发版本可以查看 CSS 文件中 `--theme-version` 的值, 或者查看项目根目录下的 `package.json` 文件
-        ( The version of the theme, if it is a development version, you can check the value of `--theme-version` in the
-        CSS file, or check the `package.json` file in the project root directory )
+        The version of the theme, if it is a development version, you can check the value of `--theme-version` in the
+        CSS file, or check the `package.json` file in the project root directory.
      placeholder: ex. 1.24.5
    validations:
      required: true
  - type: input
    id: gitea-version
    attributes:
-      label: Gitea 版本 ( Gitea Version )
-      description: 应用主题的 Gitea 版本 ( What version of Gitea are you using? )
+      label: Gitea Version
+      description: What version of Gitea are you using?
      placeholder: ex. 1.24.5
    validations:
      required: true
  - type: input
    id: page
    attributes:
-      label: 页面 ( Page )
-      description: 错误出现的页面 ( The page where the error occurred )
-      placeholder: 工单列表页 ( Issue list page )
+      label: Page
+      description: The page where the error occurred.
+      placeholder: Issue list page
    validations:
      required: true
  - type: textarea
    id: actual-behavior
    attributes:
-      label: 实际表现 ( Actual Behavior )
-      description: 请描述实际的错误表现 ( Please describe the actual error presentation )
-      placeholder: 页面底部的颜色错误 ( The color of the bottom of the page is incorrect )
+      label: Actual Behavior
+      description: Please describe the actual error presentation.
+      placeholder: The color of the bottom of the page is incorrect
    validations:
      required: true
  - type: textarea
    id: expected-behavior
    attributes:
-      label: 期望表现 ( Expected Behavior )
-      description: 请描述期望的正确表现 ( Please describe the expected correct presentation )
-      placeholder: 页面底部的颜色应该是白色 ( The color of the bottom of the page should be white )
+      label: Expected Behavior
+      description: Please describe the expected correct presentation.
+      placeholder: The color of the bottom of the page should be white
    validations:
      required: true
  - type: textarea
    id: theme-screenshot
    attributes:
-      label: 应用主题后的截图 ( Screenshot of the theme applied )
-      description: 请上传应用主题后的截图 ( Please upload a screenshot of the theme applied )
+      label: Screenshot of the theme applied
+      description: Please upload a screenshot of the theme applied.
    validations:
      required: true
  - type: textarea
    id: steps-to-reproduce
    attributes:
-      label: 复现步骤 ( Steps to reproduce )
-      description: 请描述如何复现错误 ( Please describe how to reproduce the error )
-      placeholder: 1. 安装主题 2. 刷新页面 3. 查看错误 ( 1. Install the theme 2. Refresh the page 3. View the error )
+      label: Steps to reproduce
+      description: Please describe how to reproduce the error.
+      placeholder: 1. Install the theme 2. Refresh the page 3. View the error
    validations:
      required: false
  - type: textarea
    id: bug-description
    attributes:
-      label: 错误描述 ( Bug Description )
-      description: 请描述错误的具体表现 ( Please describe the specific presentation of the error )
-      placeholder: 页面底部的颜色错误 ( The color of the bottom of the page is incorrect )
+      label: Bug Description
+      description: Please describe the specific presentation of the error.
+      placeholder: The color of the bottom of the page is incorrect
    validations:
      required: false
  - type: textarea
    id: gitea-screenshot
    attributes:
-      label: Gitea 默认主题下的截图 ( Screenshot of the default Gitea theme )
-      description: 请上传 Gitea 默认主题下的截图 ( Please upload a screenshot of the default Gitea theme )
+      label: Screenshot of the default Gitea theme
+      description: Please upload a screenshot of the default Gitea theme.
    validations:
      required: false
  - type: textarea
    id: github-screenshot
    attributes:
-      label: 可供参考的 GitHub 页面对应的截图 ( Screenshot of the corresponding GitHub page )
-      description: 请上传 GitHub 页面对应的截图 ( Please upload a screenshot of the corresponding GitHub page )
+      label: Screenshot of the corresponding GitHub page
+      description: Please upload a screenshot of the corresponding GitHub page.
    validations:
      required: false
--- a/.github/ISSUE_TEMPLATE/2-feature-request.yml
+++ b/.github/ISSUE_TEMPLATE/2-feature-request.yml
@@ -1,39 +0,0 @@
-name: 功能请求 ( Feature request )
-description: 提出新的功能建议 ( Suggest new features )
-labels: ["enhancement"]
-body:
-  - type: markdown
-    attributes:
-      value: |
-        1. 不接受非 Gitea 和 GitHub 的样式需求 ( We do not accept style requests that are not Gitea or GitHub )
-        2. 颜色需求最好自己实现 ( Color requests are best implemented by yourself )
-  - type: input
-    id: page
-    attributes:
-      label: 页面 ( Page )
-      description: 功能涉及的页面 ( The page the feature involves )
-      placeholder: 首页 ( Home page )
-    validations:
-      required: false
-  - type: textarea
-    id: feature-description
-    attributes:
-      label: 功能描述 ( Feature Description )
-      description: 请描述你想要的功能 ( Please describe the feature you want )
-      placeholder: 菜单样式修改 ( Menu style modification )
-    validations:
-      required: true
-  - type: textarea
-    id: screenshot
-    attributes:
-      label: 截图 ( Screenshot )
-      description: 预期的主题效果 ( Expected theme effect )
-    validations:
-      required: false
-  - type: textarea
-    id: github-screenshot
-    attributes:
-      label: 可供参考的 GitHub 页面对应的截图 ( Screenshot of the corresponding GitHub page )
-      description: 请上传 GitHub 页面对应的截图 ( Please upload a screenshot of the corresponding GitHub page )
-    validations:
-      required: false
--- a/.github/ISSUE_TEMPLATE/3-core-bug-report.yml
+++ b/.github/ISSUE_TEMPLATE/3-core-bug-report.yml
@@ -1,44 +1,43 @@
-name: 框架错误报告 ( Core bug report )
-description: 报告框架的错误 ( Report errors in the theme framework )
+name: Core bug report
+description: Report errors in the theme framework.
 labels: ["core bug"]
 body:
  - type: textarea
    id: actual-behavior
    attributes:
-      label: 实际表现 ( Actual Behavior )
-      description: 请描述实际的错误表现 ( Please describe the actual error presentation )
-      placeholder: 未生成自动颜色主题 ( No automatic color theme generated )
+      label: Actual Behavior
+      description: Please describe the actual error presentation.
+      placeholder: No automatic color theme generated
    validations:
      required: true
  - type: textarea
    id: expected-behavior
    attributes:
-      label: 期望表现 ( Expected Behavior )
-      description: 请描述期望的正确表现 ( Please describe the expected correct presentation )
-      placeholder: 生成自动颜色主题 ( Generate automatic color theme )
+      label: Expected Behavior
+      description: Please describe the expected correct presentation.
+      placeholder: Generate automatic color theme
    validations:
      required: true
  - type: textarea
    id: steps-to-reproduce
    attributes:
-      label: 复现步骤 ( Steps to reproduce )
-      description: 请描述如何复现错误 ( Please describe how to reproduce the error )
-      placeholder:
-        1. 新建颜色主题 2. 编译主题 3. 查看错误 ( 1. Create a color theme 2. Compile the theme 3. View the error )
+      label: Steps to reproduce
+      description: Please describe how to reproduce the error.
+      placeholder: 1. Create a color theme 2. Compile the theme 3. View the error
    validations:
      required: false
  - type: textarea
    id: bug-description
    attributes:
-      label: 错误描述 ( Bug Description )
-      description: 请描述错误的具体表现 ( Please describe the specific presentation of the error )
-      placeholder: 未生成自动颜色主题 ( No automatic color theme generated )
+      label: Bug Description
+      description: Please describe the specific presentation of the error.
+      placeholder: No automatic color theme generated
    validations:
      required: false
  - type: textarea
    id: screenshot
    attributes:
-      label: 截图 ( Screenshot )
-      description: 请上传错误的截图 ( Please upload the screenshot of the error )
+      label: Screenshot
+      description: Please upload the screenshot of the error.
    validations:
      required: false
--- a/.github/ISSUE_TEMPLATE/3-doc-report.yml
+++ b/.github/ISSUE_TEMPLATE/3-doc-report.yml
@@ -0,0 +1,12 @@
+name: Document report
+description: Improve or supplement the document.
+labels: ["documentation"]
+body:
+  - type: textarea
+    id: doc-description
+    attributes:
+      label: Document Description
+      description: Please describe the specific content of the document.
+      placeholder: The document content is incorrect
+    validations:
+      required: true
--- a/.github/ISSUE_TEMPLATE/4-doc-report.yml
+++ b/.github/ISSUE_TEMPLATE/4-doc-report.yml
@@ -1,12 +0,0 @@
-name: 文档报告 ( Document report )
-description: 改进或补充文档 ( Improve or supplement the document )
-labels: ["documentation"]
-body:
-  - type: textarea
-    id: doc-description
-    attributes:
-      label: 文档描述 ( Document Description )
-      description: 请描述文档的具体内容 ( Please describe the specific content of the document )
-      placeholder: 文档内容有误 ( The document content is incorrect )
-    validations:
-      required: true
--- a/.github/ISSUE_TEMPLATE/4-feature-request.yml
+++ b/.github/ISSUE_TEMPLATE/4-feature-request.yml
@@ -0,0 +1,39 @@
+name: Feature request
+description: Suggest new features.
+labels: ["enhancement"]
+body:
+  - type: markdown
+    attributes:
+      value: |
+        1. We do not accept style requests that are not Gitea or GitHub.
+        2. Color requests are best implemented by yourself.
+  - type: input
+    id: page
+    attributes:
+      label: Page
+      description: The page the feature involves.
+      placeholder: Home page
+    validations:
+      required: false
+  - type: textarea
+    id: feature-description
+    attributes:
+      label: Feature Description
+      description: Please describe the feature you want.
+      placeholder: Menu style modification
+    validations:
+      required: true
+  - type: textarea
+    id: screenshot
+    attributes:
+      label: Screenshot
+      description: Expected theme effect.
+    validations:
+      required: false
+  - type: textarea
+    id: github-screenshot
+    attributes:
+      label: Screenshot of the corresponding GitHub page
+      description: Please upload a screenshot of the corresponding GitHub page.
+    validations:
+      required: false
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,19 +1,11 @@
 ### 🌈 Style

-##### 更符合 GitHub 风格
-
- 优化用户动态
- 优化顶部导航栏头像
- 优化设置页面
- 优化仓库活动页面
-
-## 📃 English
-
-### 🌈 Style
-
 ##### More aligned with GitHub style

- Optimized user activity feed
- Optimized top navigation bar avatars
- Optimized settings page
- Optimized repository activity page
+- Optimize the workflow log page style
+
+### 🐞 Fix
+
+- Fix the problem of missing background color and width when there is a unicode character in the diff
+- Fix the disabled operation button interval in the code preview interface
+- Fix fixed height when scrolling through step titles on workflow detail pages
--- a/README.md
+++ b/README.md
@@ -6,67 +6,71 @@
  <img src="https://img.shields.io/github/downloads/lutinglt/gitea-github-theme/latest/total?style=for-the-badge&labelColor=25292e&color=238636">
 </h1>

-<div align="center">
+<h4 align="center">

-中文 • [English](README_EN.md)
+A Gitea theme that pursues GitHub style not only in colors but also in styling details.

-不仅仅是在颜色上, 在样式细节上也追求 GitHub 风格的 Gitea 主题.
+</h4>

-</div>
-
-![Dashboard](screenshots/dashboard.png)
+![Dashboard](screenshots/en/dashboard-en.png)

 > [!TIP]
 >
-> 推荐搭配 Catppuccin 文件图标浏览器插件一起使用更佳
+> Recommend using Catppuccin file icon browser plugin together for better performance.
 > [web-file-explorer-icons](https://github.com/catppuccin/web-file-explorer-icons)

-## 版本号说明
+## Version Number Explanation

-主题版本号与 Gitea 版本号保持一致
+The theme version number is kept consistent with the Gitea version number

-Gitea 版本号格式: `1.大版本号.小版本号`
+Gitea version number format: `1.major.minor`

-Gitea 理论上小版本号变更不会修改前端布局, 所以主题的小版本号适用于所有 Gitea 大版本号相同的 Gitea 版本.
+Theoretically, minor version changes in Gitea do not modify the frontend layout, so the minor version of the theme is
+applicable to all Gitea versions with the same major version number.

-比如: 主题版本 `1.24.5` 适用于 Gitea 版本 `>=1.24.0` `<1.25.0`
+For example: Theme version `1.24.5` is applicable to Gitea versions `>=1.24.0` `<1.25.0`

-仅维护项目发布中的最新的 Gitea 版本, 其他旧版本主题不接受 Issue 和 PR.
+Only the latest released Gitea version is maintained. Issues and PRs for other older theme versions will not be
+accepted.

-> 开发阶段的主题版本号格式: `1.大版本号.小版本号.时间戳`
+> Development stage theme version number format: `1.major.minor.timestamp`

-### 主题版本发布规则
+### Theme Version Release Rules

- 当 Gitea 发布小版本时, 主题中间如有变更, 则发布新的和 Gitea 小版本相同的主题版本
- 当 Gitea 发布大版本时, 主题中间如有变更, 会发布 `1.旧大版本号.latest` 的主题版本并不再维护旧版本
- 适配大版本的预发布版本为 `1.大版本号.rc`, 当无明显 BUG 时发布与 Gitea 大版本相同的主题版本
+- When Gitea releases a minor version, if there are changes in the theme, a new theme version with the same minor
+  version as Gitea will be released
+- When Gitea releases a major version, if there are changes in the theme, a theme version `1.old_major_version.latest`
+  will be released and the old version will no longer be maintained
+- The pre-release version for major version adaptation is `1.major_version.rc`, and when there are no obvious bugs, a
+  theme version with the same major version as Gitea will be released

-## 安装
+## Installation

-1. 在发布页下载最新的 CSS 主题文件放入 `gitea/public/assets/css` 目录下
-2. 修改 `gitea/conf/app.ini`，并将 CSS 文件名去掉 `theme-` 的名称附加到 `[ui]` 下的 `THEMES` 末尾
-3. 重启 Gitea
-4. 在设置中查看主题
+1. Download the latest CSS theme file from the release page and place it in the `gitea/public/assets/css` directory
+2. Modify `gitea/conf/app.ini` and append the CSS filename without the `theme-` prefix to the end of `THEMES` under the
+   `[ui]` section
+3. Restart Gitea
+4. Check the theme in the settings

-例: 主题文件名为 `theme-github-dark.css`，则添加 `github-dark` 到 `THEMES` 末尾
+Example: If the theme filename is `theme-github-dark.css`, add `github-dark` to the end of `THEMES`

-`gitea/conf/app.ini` 例:
+Example `gitea/conf/app.ini`:

 ```ini
 [ui]
 THEMES = gitea-auto, gitea-light, gitea-dark, github-auto, github-light, github-dark, github-soft-dark
 ```

-详细请查看 Gitea 文档
+For details, please refer to the Gitea documentation
 [Gitea docs](https://docs.gitea.com/next/administration/customizing-gitea#customizing-the-look-of-gitea)

 > [!IMPORTANT]
 >
-> 自动颜色主题需要亮色和暗色的主题文件
+> Automatic color theme requires both light and dark theme files.

-## 截图
+## Screenshots

-### 基本主题
+### Basic Themes

 ```ini
 THEMES = github-auto, github-light, github-dark, github-soft-dark
@@ -75,14 +79,14 @@ THEMES = github-auto, github-light, github-dark, github-soft-dark
 <details>
 <summary>Base</summary>
 <h4>theme-github-light.css</h4>
-<img src="screenshots/light.png"/>
+<img src="screenshots/en/light.png"/>
 <h4>theme-github-dark.css</h4>
-<img src="screenshots/dark.png"/>
+<img src="screenshots/en/dark.png"/>
 <h4>theme-github-soft-dark.css</h4>
-<img src="screenshots/soft-dark.png"/>
+<img src="screenshots/en/soft-dark.png"/>
 </details>

-### 色盲主题 ( Beta )
+### Colorblind Themes (Beta)

 ```ini
 THEMES = github-colorblind-auto, github-colorblind-light, github-colorblind-dark
@@ -90,14 +94,14 @@ THEMES = github-tritanopia-auto, github-tritanopia-light, github-tritanopia-dark
 ```

 <details>
-<summary>Colorblind & Tritanopia (红绿色盲 & 蓝色盲)</summary>
+<summary>Colorblind & Tritanopia</summary>
 <h4>theme-github-colorblind-light.css & theme-github-tritanopia-light.css</h4>
-<img src="screenshots/colorblind-light.png"/>
+<img src="screenshots/en/colorblind-light.png"/>
 <h4>theme-github-colorblind-dark.css & theme-github-tritanopia-dark.css</h4>
-<img src="screenshots/colorblind-dark.png"/>
+<img src="screenshots/en/colorblind-dark.png"/>
 </details>

-### 粉色主题
+### Pink Themes

 ```ini
 THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft-dark
@@ -106,20 +110,20 @@ THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft
 <details>
 <summary>Pink</summary>
 <h4>theme-github-pink-light.css</h4>
-<img src="screenshots/pink/pink-light.png"/>
+<img src="screenshots/pink/en/pink-light-en.png"/>
 <h4>theme-github-pink-dark.css</h4>
-<img src="screenshots/pink/pink-dark.png"/>
+<img src="screenshots/pink/en/pink-dark-en.png"/>
 <h4>theme-github-pink-soft-dark.css</h4>
-<img src="screenshots/pink/pink-soft-dark.png"/>
+<img src="screenshots/pink/en/pink-soft-dark-en.png"/>
 </details>

-## 自定义 CSS 变量
+## Custom CSS Variables

-可以根据自己的偏好自定义主题的一部分样式
+You can customize parts of the theme style according to your preferences

-### 使用方法
+### Usage Method

-在主题的 CSS 文件的头部或尾部添加以下代码
+Add the following code at the beginning or end of the theme's CSS file

 ```css
 :root {
@@ -130,30 +134,31 @@ THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft

 > [!IMPORTANT]
 >
-> 请确保在 `:root` 选择器中添加自定义变量，否则无法生效
+> Please ensure to add custom variables in the `:root` selector, otherwise they will not take effect
 >
-> 变量之间用 `;` 分隔
+> Variables are separated by `;`
 >
-> 建议自定义变量放在单独的文件中, 通过 shell 命令等方式追加到主题文件中
+> It is recommended to place custom variables in a separate file and append them to the theme file using shell commands
+> or other methods

-### CSS 变量
+### CSS Variables

-| 变量名                            | 描述                        | 默认  | Github | 推荐  | 最小  | 最大  |
-| :-------------------------------- | :-------------------------- | :---- | :----- | :---- | :---- | :---- |
-| --custom-branch-menu-width        | 分支菜单的宽度              | 320px | 320px  | 320px | Gitea | 640px |
-| --custom-clone-menu-width         | 克隆按钮的菜单宽度          | Gitea | 332px  | 200px | 150px | 400px |
-| --custom-user-menu-width          | 用户菜单的宽度              | 192px | 256px  |       | Gitea | 320px |
-| --custom-explore-repolist-columns | 探索页面的仓库列表列数      | 2     | 2      | 2     |       |       |
-| --custom-explore-userlist-columns | 探索页面的用户/组织列表列数 | 3     | 1      | 2/3   |       |       |
-| --custom-user-repolist-columns    | 用户页面的仓库列表列数      | 2     | 2      | 1/2   |       |       |
-| --custom-org-repolist-columns     | 组织页面的仓库列表列数      | 1     | 1      | 1/2   |       |       |
-| --custom-org-userlist-columns     | 组织页面的用户列表列数      | 2     | 1      | 1/2   |       |       |
+| Variable Name                     | Description                                              | Default | Github | Recommend | Min   | Max   |
+| :-------------------------------- | :------------------------------------------------------- | :------ | :----- | :-------- | :---- | :---- |
+| --custom-branch-menu-width        | Branch menu width                                        | 320px   | 320px  | 320px     | Gitea | 640px |
+| --custom-clone-menu-width         | Clone button menu width                                  | Gitea   | 332px  | 200px     | 150px | 400px |
+| --custom-user-menu-width          | User menu width                                          | 192px   | 200px  |           | Gitea | 320px |
+| --custom-explore-repolist-columns | Number of repository list columns on explore page        | 2       | 2      | 2         |       |       |
+| --custom-explore-userlist-columns | Number of user/organization list columns on explore page | 3       | 1      | 2/3       |       |       |
+| --custom-user-repolist-columns    | Number of repository list columns on user page           | 2       | 2      | 1/2       |       |       |
+| --custom-org-repolist-columns     | Number of repository list columns on organization page   | 1       | 1      | 1/2       |       |       |
+| --custom-org-userlist-columns     | Number of user list columns on organization page         | 2       | 1      | 1/2       |       |       |

-## 使用开发中的主题
+## Using Development Version of the Theme

-也许你会想使用开发中的主题, 而不是发布的主题
+You might want to use the development version of the theme instead of the released version

-请确保你已经安装了 Node.js 环境, 推荐使用 Node.js 20 或以上版本
+Please ensure you have Node.js environment installed, Node.js 20 or above is recommended

 ```bash
 git clone https://github.com/lutinglt/gitea-github-theme.git
@@ -162,5 +167,5 @@ npm install
 npm run build
 ```

-编译完成后, 会在 `dist` 目录下生成主题文件, 你可以将主题文件放入 `gitea/public/assets/css` 目录下, 然后在
-`gitea/conf/app.ini` 中添加主题名称到 `THEMES` 末尾
+After compilation, theme files will be generated in the `dist` directory. You can place the theme files into the
+`gitea/public/assets/css` directory, then add the theme name to the end of `THEMES` in `gitea/conf/app.ini`
--- a/README_CN.md
+++ b/README_CN.md
@@ -0,0 +1,164 @@
+<h1 align="center">
+  <p>Gitea GitHub Theme</p>
+  <img src="https://img.shields.io/github/issues-raw/lutinglt/gitea-github-theme?style=for-the-badge&labelColor=25292e&color=1a7f37">
+  <img src="https://img.shields.io/github/issues-closed-raw/lutinglt/gitea-github-theme?style=for-the-badge&labelColor=25292e&color=8250df">
+  <img src="https://img.shields.io/github/downloads/lutinglt/gitea-github-theme/total?style=for-the-badge&labelColor=25292e&color=1f6feb">
+  <img src="https://img.shields.io/github/downloads/lutinglt/gitea-github-theme/latest/total?style=for-the-badge&labelColor=25292e&color=238636">
+</h1>
+
+<h4 align="center">
+
+不仅仅是在颜色上, 在样式细节上也追求 GitHub 风格的 Gitea 主题
+
+</h4>
+
+![Dashboard](screenshots/dashboard.png)
+
+> [!TIP]
+>
+> 推荐搭配 Catppuccin 文件图标浏览器插件一起使用更佳
+> [web-file-explorer-icons](https://github.com/catppuccin/web-file-explorer-icons)
+
+## 版本号说明
+
+主题版本号与 Gitea 版本号保持一致
+
+Gitea 版本号格式: `1.大版本号.小版本号`
+
+Gitea 理论上小版本号变更不会修改前端布局, 所以主题的小版本号适用于所有 Gitea 大版本号相同的 Gitea 版本.
+
+比如: 主题版本 `1.24.5` 适用于 Gitea 版本 `>=1.24.0` `<1.25.0`
+
+仅维护项目发布中的最新的 Gitea 版本, 其他旧版本主题不接受 Issue 和 PR.
+
+> 开发阶段的主题版本号格式: `1.大版本号.小版本号.时间戳`
+
+### 主题版本发布规则
+
+- 当 Gitea 发布小版本时, 主题中间如有变更, 则发布新的和 Gitea 小版本相同的主题版本
+- 当 Gitea 发布大版本时, 主题中间如有变更, 会发布 `1.旧大版本号.latest` 的主题版本并不再维护旧版本
+- 适配大版本的预发布版本为 `1.大版本号.rc`, 当无明显 BUG 时发布与 Gitea 大版本相同的主题版本
+
+## 安装
+
+1. 在发布页下载最新的 CSS 主题文件放入 `gitea/public/assets/css` 目录下
+2. 修改 `gitea/conf/app.ini`，并将 CSS 文件名去掉 `theme-` 的名称附加到 `[ui]` 下的 `THEMES` 末尾
+3. 重启 Gitea
+4. 在设置中查看主题
+
+例: 主题文件名为 `theme-github-dark.css`，则添加 `github-dark` 到 `THEMES` 末尾
+
+`gitea/conf/app.ini` 例:
+
+```ini
+[ui]
+THEMES = gitea-auto, gitea-light, gitea-dark, github-auto, github-light, github-dark, github-soft-dark
+```
+
+详细请查看 Gitea 文档
+[Gitea docs](https://docs.gitea.com/next/administration/customizing-gitea#customizing-the-look-of-gitea)
+
+> [!IMPORTANT]
+>
+> 自动颜色主题需要亮色和暗色的主题文件
+
+## 截图
+
+### 基本主题
+
+```ini
+THEMES = github-auto, github-light, github-dark, github-soft-dark
+```
+
+<details>
+<summary>Base</summary>
+<h4>theme-github-light.css</h4>
+<img src="screenshots/light.png"/>
+<h4>theme-github-dark.css</h4>
+<img src="screenshots/dark.png"/>
+<h4>theme-github-soft-dark.css</h4>
+<img src="screenshots/soft-dark.png"/>
+</details>
+
+### 色盲主题 ( Beta )
+
+```ini
+THEMES = github-colorblind-auto, github-colorblind-light, github-colorblind-dark
+THEMES = github-tritanopia-auto, github-tritanopia-light, github-tritanopia-dark
+```
+
+<details>
+<summary>Colorblind & Tritanopia (红绿色盲 & 蓝色盲)</summary>
+<h4>theme-github-colorblind-light.css & theme-github-tritanopia-light.css</h4>
+<img src="screenshots/colorblind-light.png"/>
+<h4>theme-github-colorblind-dark.css & theme-github-tritanopia-dark.css</h4>
+<img src="screenshots/colorblind-dark.png"/>
+</details>
+
+### 粉色主题
+
+```ini
+THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft-dark
+```
+
+<details>
+<summary>Pink</summary>
+<h4>theme-github-pink-light.css</h4>
+<img src="screenshots/pink/pink-light.png"/>
+<h4>theme-github-pink-dark.css</h4>
+<img src="screenshots/pink/pink-dark.png"/>
+<h4>theme-github-pink-soft-dark.css</h4>
+<img src="screenshots/pink/pink-soft-dark.png"/>
+</details>
+
+## 自定义 CSS 变量
+
+可以根据自己的偏好自定义主题的一部分样式
+
+### 使用方法
+
+在主题的 CSS 文件的头部或尾部添加以下代码
+
+```css
+:root {
+  --custom-clone-menu-width: 150px;
+  ...
+}
+```
+
+> [!IMPORTANT]
+>
+> 请确保在 `:root` 选择器中添加自定义变量，否则无法生效
+>
+> 变量之间用 `;` 分隔
+>
+> 建议自定义变量放在单独的文件中, 通过 shell 命令等方式追加到主题文件中
+
+### CSS 变量
+
+| 变量名                            | 描述                        | 默认  | Github | 推荐  | 最小  | 最大  |
+| :-------------------------------- | :-------------------------- | :---- | :----- | :---- | :---- | :---- |
+| --custom-branch-menu-width        | 分支菜单的宽度              | 320px | 320px  | 320px | Gitea | 640px |
+| --custom-clone-menu-width         | 克隆按钮的菜单宽度          | Gitea | 332px  | 200px | 150px | 400px |
+| --custom-user-menu-width          | 用户菜单的宽度              | 192px | 256px  |       | Gitea | 320px |
+| --custom-explore-repolist-columns | 探索页面的仓库列表列数      | 2     | 2      | 2     |       |       |
+| --custom-explore-userlist-columns | 探索页面的用户/组织列表列数 | 3     | 1      | 2/3   |       |       |
+| --custom-user-repolist-columns    | 用户页面的仓库列表列数      | 2     | 2      | 1/2   |       |       |
+| --custom-org-repolist-columns     | 组织页面的仓库列表列数      | 1     | 1      | 1/2   |       |       |
+| --custom-org-userlist-columns     | 组织页面的用户列表列数      | 2     | 1      | 1/2   |       |       |
+
+## 使用开发中的主题
+
+也许你会想使用开发中的主题, 而不是发布的主题
+
+请确保你已经安装了 Node.js 环境, 推荐使用 Node.js 20 或以上版本
+
+```bash
+git clone https://github.com/lutinglt/gitea-github-theme.git
+cd gitea-github-theme
+npm install
+npm run build
+```
+
+编译完成后, 会在 `dist` 目录下生成主题文件, 你可以将主题文件放入 `gitea/public/assets/css` 目录下, 然后在
+`gitea/conf/app.ini` 中添加主题名称到 `THEMES` 末尾
--- a/README_EN.md
+++ b/README_EN.md
@@ -1,173 +0,0 @@
-<h1 align="center">
-  <p>Gitea GitHub Theme</p>
-  <img src="https://img.shields.io/github/issues-raw/lutinglt/gitea-github-theme?style=for-the-badge&labelColor=25292e&color=1a7f37">
-  <img src="https://img.shields.io/github/issues-closed-raw/lutinglt/gitea-github-theme?style=for-the-badge&labelColor=25292e&color=8250df">
-  <img src="https://img.shields.io/github/downloads/lutinglt/gitea-github-theme/total?style=for-the-badge&labelColor=25292e&color=1f6feb">
-  <img src="https://img.shields.io/github/downloads/lutinglt/gitea-github-theme/latest/total?style=for-the-badge&labelColor=25292e&color=238636">
-</h1>
-
-<div align="center">
-
-English • [中文](README.md)
-
-A Gitea theme that pursues GitHub style not only in colors but also in styling details.
-
-</div>
-
-![Dashboard](screenshots/en/dashboard-en.png)
-
-> [!TIP]
->
-> Recommend using Catppuccin file icon browser plugin together for better performance.
-> [web-file-explorer-icons](https://github.com/catppuccin/web-file-explorer-icons)
-
-## Version Number Explanation
-
-The theme version number is kept consistent with the Gitea version number
-
-Gitea version number format: `1.major.minor`
-
-Theoretically, minor version changes in Gitea do not modify the frontend layout, so the minor version of the theme is
-applicable to all Gitea versions with the same major version number.
-
-For example: Theme version `1.24.5` is applicable to Gitea versions `>=1.24.0` `<1.25.0`
-
-Only the latest released Gitea version is maintained. Issues and PRs for other older theme versions will not be
-accepted.
-
-> Development stage theme version number format: `1.major.minor.timestamp`
-
-### Theme Version Release Rules
-
- When Gitea releases a minor version, if there are changes in the theme, a new theme version with the same minor
-  version as Gitea will be released
- When Gitea releases a major version, if there are changes in the theme, a theme version `1.old_major_version.latest`
-  will be released and the old version will no longer be maintained
- The pre-release version for major version adaptation is `1.major_version.rc`, and when there are no obvious bugs, a
-  theme version with the same major version as Gitea will be released
-
-## Installation
-
-1. Download the latest CSS theme file from the release page and place it in the `gitea/public/assets/css` directory
-2. Modify `gitea/conf/app.ini` and append the CSS filename without the `theme-` prefix to the end of `THEMES` under the
-   `[ui]` section
-3. Restart Gitea
-4. Check the theme in the settings
-
-Example: If the theme filename is `theme-github-dark.css`, add `github-dark` to the end of `THEMES`
-
-Example `gitea/conf/app.ini`:
-
-```ini
-[ui]
-THEMES = gitea-auto, gitea-light, gitea-dark, github-auto, github-light, github-dark, github-soft-dark
-```
-
-For details, please refer to the Gitea documentation
-[Gitea docs](https://docs.gitea.com/next/administration/customizing-gitea#customizing-the-look-of-gitea)
-
-> [!IMPORTANT]
->
-> Automatic color theme requires both light and dark theme files.
-
-## Screenshots
-
-### Basic Themes
-
-```ini
-THEMES = github-auto, github-light, github-dark, github-soft-dark
-```
-
-<details>
-<summary>Base</summary>
-<h4>theme-github-light.css</h4>
-<img src="screenshots/en/light.png"/>
-<h4>theme-github-dark.css</h4>
-<img src="screenshots/en/dark.png"/>
-<h4>theme-github-soft-dark.css</h4>
-<img src="screenshots/en/soft-dark.png"/>
-</details>
-
-### Colorblind Themes (Beta)
-
-```ini
-THEMES = github-colorblind-auto, github-colorblind-light, github-colorblind-dark
-THEMES = github-tritanopia-auto, github-tritanopia-light, github-tritanopia-dark
-```
-
-<details>
-<summary>Colorblind & Tritanopia</summary>
-<h4>theme-github-colorblind-light.css & theme-github-tritanopia-light.css</h4>
-<img src="screenshots/en/colorblind-light.png"/>
-<h4>theme-github-colorblind-dark.css & theme-github-tritanopia-dark.css</h4>
-<img src="screenshots/en/colorblind-dark.png"/>
-</details>
-
-### Pink Themes
-
-```ini
-THEMES = github-pink-auto, github-pink-light, github-pink-dark, github-pink-soft-dark
-```
-
-<details>
-<summary>Pink</summary>
-<h4>theme-github-pink-light.css</h4>
-<img src="screenshots/pink/en/pink-light-en.png"/>
-<h4>theme-github-pink-dark.css</h4>
-<img src="screenshots/pink/en/pink-dark-en.png"/>
-<h4>theme-github-pink-soft-dark.css</h4>
-<img src="screenshots/pink/en/pink-soft-dark-en.png"/>
-</details>
-
-## Custom CSS Variables
-
-You can customize parts of the theme style according to your preferences
-
-### Usage Method
-
-Add the following code at the beginning or end of the theme's CSS file
-
-```css
-:root {
-  --custom-clone-menu-width: 150px;
-  ...
-}
-```
-
-> [!IMPORTANT]
->
-> Please ensure to add custom variables in the `:root` selector, otherwise they will not take effect
->
-> Variables are separated by `;`
->
-> It is recommended to place custom variables in a separate file and append them to the theme file using shell commands
-> or other methods
-
-### CSS Variables
-
-| Variable Name                     | Description                                              | Default | Github | Recommend | Min   | Max   |
-| :-------------------------------- | :------------------------------------------------------- | :------ | :----- | :-------- | :---- | :---- |
-| --custom-branch-menu-width        | Branch menu width                                        | 320px   | 320px  | 320px     | Gitea | 640px |
-| --custom-clone-menu-width         | Clone button menu width                                  | Gitea   | 332px  | 200px     | 150px | 400px |
-| --custom-user-menu-width          | User menu width                                          | 192px   | 200px  |           | Gitea | 320px |
-| --custom-explore-repolist-columns | Number of repository list columns on explore page        | 2       | 2      | 2         |       |       |
-| --custom-explore-userlist-columns | Number of user/organization list columns on explore page | 3       | 1      | 2/3       |       |       |
-| --custom-user-repolist-columns    | Number of repository list columns on user page           | 2       | 2      | 1/2       |       |       |
-| --custom-org-repolist-columns     | Number of repository list columns on organization page   | 1       | 1      | 1/2       |       |       |
-| --custom-org-userlist-columns     | Number of user list columns on organization page         | 2       | 1      | 1/2       |       |       |
-
-## Using Development Version of the Theme
-
-You might want to use the development version of the theme instead of the released version
-
-Please ensure you have Node.js environment installed, Node.js 20 or above is recommended
-
-```bash
-git clone https://github.com/lutinglt/gitea-github-theme.git
-cd gitea-github-theme
-npm install
-npm run build
-```
-
-After compilation, theme files will be generated in the `dist` directory. You can place the theme files into the
-`gitea/public/assets/css` directory, then add the theme name to the end of `THEMES` in `gitea/conf/app.ini`
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "gitea-github-theme",
-  "version": "1.25.0",
+  "version": "1.25.2",
  "type": "module",
  "scripts": {
    "dev": "vite build --mode dev",
--- a/screenshots/dashboard.png
+++ b/screenshots/dashboard.png
--- a/screenshots/en/dashboard-en.png
+++ b/screenshots/en/dashboard-en.png
--- a/src/core/github.ts
+++ b/src/core/github.ts
@@ -7,6 +7,7 @@ import { type ThemeColor } from "./color";

 export type GithubColor = {
  isDarkTheme: boolean;
+  avatar: { bgColor: string; borderColor: string };
  display: {
    blue: { fgColor: string };
    brown: { fgColor: string };
@@ -221,6 +222,10 @@ export function github2ThemeColor(githubColor: GithubColor): ThemeColor {
  };

  const github: Github = {
+    avatar: {
+      bgColor: githubColor.avatar.bgColor,
+      borderColor: githubColor.avatar.borderColor,
+    },
    fgColor: {
      accent: githubColor.fgColor.accent,
      success: githubColor.fgColor.success,
--- a/src/core/theme.ts
+++ b/src/core/theme.ts
@@ -6,6 +6,13 @@ import type { MapLeafNodes, WithOptionalLayer } from "./types";

 export type Theme = WithOptionalLayer<MapLeafNodes<typeof themeVars, string>>;

+export const overlayAppear = "overlay-appear";
+export const animation = {
+  animation: overlayAppear,
+  animationDuration: "80ms",
+  animationFillMode: "forwards",
+  animationTimingFunction: "ease-in",
+};
 export const overlayAppearDown = "overlay-appear-down";
 export const animationDown = `200ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running ${overlayAppearDown}`;
 export const overlayAppearUp = "overlay-appear-up";
--- a/src/types/color/github.ts
+++ b/src/types/color/github.ts
@@ -1,4 +1,10 @@
 export const github = {
+  avatar: {
+    /** 头像的背景颜色 */
+    bgColor: null,
+    /** 头像的边框颜色 */
+    borderColor: null,
+  },
  /** 用于 color 属性的颜色 */
  fgColor: {
    /** 强调色
@@ -188,6 +194,7 @@ export const github = {
         * @issue `issueList` 头部菜单左侧开启关闭菜单的悬停背景颜色
         * @dashboard `dashboard` 仓库列表项目的悬停背景颜色
         * @notification `notification` 通知列表的按钮悬停背景颜色
+         * @actions `actions` 列表页运行信息的三点操作按钮悬停背景颜色
         */
        hover: null,
      },
--- a/styles/components/actions.ts
+++ b/styles/components/actions.ts
@@ -88,9 +88,10 @@ export const actions = css`
              border-radius: ${otherThemeVars.border.radius};
            }
            > .ui.dropdown.jump {
+              border-radius: ${otherThemeVars.border.radius};
              color: ${themeVars.color.text.light.num1};
              &:hover {
-                color: ${themeVars.color.primary.self};
+                background-color: ${themeVars.github.control.transparent.bgColor.hover};
              }
              .menu > .item:hover {
                color: ${themeVars.color.text.self} !important;
@@ -155,7 +156,6 @@ export const actionViewLeft = css`
  .action-view-left {
    margin-right: 28px;
    border-top: 1px solid ${themeVars.color.console.border};
-
    &:before {
      content: "Jobs";
      color: ${themeVars.color.console.fg.subtle};
@@ -167,52 +167,53 @@ export const actionViewLeft = css`
      top: -8px;
      left: 15px;
    }
-
    .job-group-section {
      padding-right: 8px;
      padding-bottom: 8px;
      border-bottom: 1px solid ${themeVars.color.console.border};
-
-      .job-brief-item {
-        border-radius: ${otherThemeVars.border.radius} !important;
-        padding: 8px;
-        position: relative;
-        margin-left: 0.5rem;
-
-        &.selected {
+      .job-brief-list {
+        gap: 4px;
+        // 双重确保覆盖原始样式
+        .job-brief-item.job-brief-item {
+          border-radius: ${otherThemeVars.border.radius} !important;
+          padding: 8px;
+          position: relative;
+          margin-left: 0.5rem;
          &:hover {
            background-color: ${themeVars.color.console.hoverBg};
          }
-
-          &:after {
-            overflow: visible;
-            background: ${themeVars.github.borderColor.accent.emphasis};
-            border-radius: ${otherThemeVars.border.radius};
-            content: "";
-            height: 24px;
-            left: calc(0.5rem * -1);
-            position: absolute;
-            top: calc(50% - 12px);
-            width: 4px;
-          }
-        }
-        .job-brief-item-right {
-          svg.job-brief-rerun {
-            display: none;
-            color: ${themeVars.color.console.fg.subtle};
-            &:hover {
-              color: ${themeVars.color.text.self};
+          &.selected {
+            &:after {
+              overflow: visible;
+              background: ${themeVars.github.borderColor.accent.emphasis};
+              border-radius: ${otherThemeVars.border.radius};
+              content: "";
+              height: 24px;
+              left: calc(0.5rem * -1);
+              position: absolute;
+              top: calc(50% - 12px);
+              width: 4px;
            }
          }
-          .step-summary-duration {
-            color: ${themeVars.color.console.fg.subtle};
-            font-family: var(--fonts-monospace);
-          }
-        }
-        &:hover {
          .job-brief-item-right {
            svg.job-brief-rerun {
-              display: inline-block;
+              display: none;
+              color: ${themeVars.color.console.fg.subtle};
+              &:hover {
+                color: ${themeVars.color.text.self};
+              }
+            }
+            .step-summary-duration {
+              color: ${themeVars.color.console.fg.subtle};
+              font-family: var(--fonts-monospace);
+              font-size: 12px;
+            }
+          }
+          &:hover {
+            .job-brief-item-right {
+              svg.job-brief-rerun {
+                display: inline-block;
+              }
            }
          }
        }
@@ -252,52 +253,57 @@ export const actionViewRight = css`
    }

    .job-step-container {
-      // 步骤标题
-      .job-step-summary {
-        color: ${themeVars.color.console.fg.subtle};
-        padding: 8px 10px !important;
-
-        &.selected {
-          // 滚动时固定在顶部的高度与 job-info-header 高度相同
-          top: 80px;
-        }
-
-        &.step-expandable:hover {
+      padding: 8px;
+      .job-step-section {
+        margin: 0 4px 4px;
+        // 步骤标题, 双重确保覆盖原始样式
+        .job-step-summary.job-step-summary {
          color: ${themeVars.color.console.fg.subtle};
-        }
+          padding: 8px !important;
+          height: 36px;

-        .tw-mr-2:not(.svg) svg.svg {
-          margin: 1.5px 6px 0px 2px;
-        }
-        /* 绿色步骤状态改为白色 */
-        svg.svg.text.green {
-          color: ${themeVars.color.console.fg.subtle} !important;
-        }
+          &.selected {
+            // 滚动时固定在顶部的高度与 job-info-header 高度相同
+            top: 80px;
+          }

-        &.selected {
-          /* 不被 hover 效果影响 */
-          color: ${themeVars.color.console.fg.self} !important;
-          background-color: ${themeVars.color.console.activeBg} !important;
+          &.step-expandable:hover {
+            color: ${themeVars.color.console.fg.subtle};
+          }

+          .tw-mr-2:not(.svg) svg.svg {
+            margin: 1.5px 6px 0px 2px;
+          }
+          /* 绿色步骤状态改为白色 */
          svg.svg.text.green {
+            color: ${themeVars.color.console.fg.subtle} !important;
+          }
+
+          &.selected {
+            /* 不被 hover 效果影响 */
            color: ${themeVars.color.console.fg.self} !important;
+            background-color: ${themeVars.color.console.activeBg} !important;
+
+            svg.svg.text.green {
+              color: ${themeVars.color.console.fg.self} !important;
+            }
+          }
+          // 步骤耗时
+          .step-summary-duration {
+            font-size: 12px;
+            font-family: var(--fonts-monospace);
          }
        }
-        // 步骤耗时
-        .step-summary-duration {
-          font-size: 12px;
-          font-family: var(--fonts-monospace);
-        }
-      }
-      // 步骤日志
-      .job-step-logs {
-        animation: ${animationDown};
-        /* 日志字体颜色白色 */
-        .job-log-line {
-          color: ${themeVars.color.console.fg.self};
-          /* 被 hover 时覆盖 ANSI 颜色 */
-          .log-msg:hover * {
-            color: ${themeVars.color.console.fg.self} !important;
+        // 步骤日志
+        .job-step-logs {
+          animation: ${animationDown};
+          /* 日志字体颜色白色 */
+          .job-log-line {
+            color: ${themeVars.color.console.fg.self};
+            /* 被 hover 时覆盖 ANSI 颜色 */
+            .log-msg:hover * {
+              color: ${themeVars.color.console.fg.self} !important;
+            }
          }
        }
      }
--- a/styles/components/commit.ts
+++ b/styles/components/commit.ts
@@ -7,6 +7,9 @@ export const commit = css`
    #commits-table.ui.basic.striped.table tbody.commit-list {
      // 作者
      .author {
+        img.ui.avatar {
+          border-radius: 9999px;
+        }
        // 作者名称
        .author-wrapper {
          color: ${themeVars.color.text.light.num1};
@@ -26,7 +29,7 @@ export const commit = css`
      .message {
        // tag 标签
        a.ui.basic.primary.label {
-          border-radius: 25px;
+          border-radius: 9999px;
          border-width: 1.5px;
          padding: 3px 8px !important;
        }
@@ -85,6 +88,9 @@ export const commitStatus = css`
 // 提交图
 export const commitGraph = css`
  .page-content.repository #git-graph-container {
+    img.ui.avatar {
+      border-radius: 9999px;
+    }
    // 提交图的 SHA 标签
    li .ui.label.commit-id-short {
      height: 25px;
@@ -95,10 +101,5 @@ export const commitGraph = css`
        }
      }
    }
-    // 提交图的分支选择菜单框
-    .ui.search.selection.dropdown > .menu > .item {
-      flex-direction: row;
-      align-items: center;
-    }
  }
 `;
--- a/styles/components/diff.ts
+++ b/styles/components/diff.ts
@@ -1,15 +1,49 @@
-import { css, themeVars } from "src/types/vars";
+import { css, otherThemeVars, themeVars } from "src/types/vars";

 export const diff = css`
-  /* 折叠行多余的颜色 */
+  // 这里的折叠行和代码行高度与 GitHub 的 release 和 review 的差异对比时的高度一致, 不需要像 commit 中的差异对比那样行高过高
+  // release 和 review 行高为 20px, commit 行高为 24px
+  // 折叠行
  .tag-code {
+    // 多余的颜色
    background-color: unset;
-    /* 折叠行文本 */
+    height: 28px;
+    // 展开按钮高度与折叠行一致
+    .code-expander-buttons {
+      .code-expander-button {
+        height: 28px;
+      }
+    }
+    // 双向展开的按钮
+    &:has(.code-expander-buttons[data-expand-direction="3"]) {
+      height: 40px;
+      .code-expander-button {
+        height: 20px;
+      }
+    }
+    // 展开按钮
+    .code-expander-button {
+      color: ${themeVars.color.text.light.num1};
+      &:hover {
+        background: ${themeVars.github.bgColor.accent.emphasis};
+        color: ${themeVars.color.white};
+      }
+    }
+    // 折叠行文本
    .code-inner {
      color: ${themeVars.color.text.light.num1};
    }
  }
-  /* 增加/删除行多余的颜色 */
+  // 代码行
+  .lines-num,
+  .lines-code {
+    line-height: 20px;
+  }
+  // 行号居中
+  .lines-num {
+    text-align: center !important;
+  }
+  // 增加/删除行多余的颜色
  .code-diff-unified {
    .del-code,
    .add-code {
@@ -17,29 +51,16 @@ export const diff = css`
      border-color: unset;
    }
  }
-  /* 增加/删除相关代码背景色圆角 */
+  // 增加/删除相关代码背景色圆角
  .added-code,
  .removed-code {
-    border-radius: 0.1875rem;
+    border-radius: 3px;
    color: ${themeVars.color.text.self};
-    /* 覆盖掉 chroma 的颜色 */
+    // 覆盖掉 chroma 的颜色
    * {
      color: ${themeVars.color.text.self} !important;
    }
  }
-  /* 展开/收缩按钮 */
-  .code-expander-button {
-    color: ${themeVars.color.text.light.num1};
-    height: 28px !important;
-    &:hover {
-      background: ${themeVars.github.bgColor.accent.emphasis};
-      color: ${themeVars.color.white};
-    }
-  }
-  /* 行号居中 */
-  .lines-num {
-    text-align: center !important;
-  }
  // 差异对比文件盒子
  .diff-file-box {
    // 差异对比文件头
@@ -66,7 +87,66 @@ export const diff = css`
        color: ${themeVars.color.text.light.num1};
        font-size: 12px;
        font-weight: 400;
+        .diff-header-popup-btn {
+          border-radius: ${otherThemeVars.border.radius};
+          padding: 5px !important;
+          &:hover {
+            background-color: ${themeVars.github.control.transparent.bgColor.hover};
+          }
+        }
      }
    }
  }
+  // 差异对比文件盒子
+  .repository .diff-file-box {
+    .code-diff {
+      // 隐藏多余的空白
+      // 合并视图的第三列
+      &.code-diff-unified colgroup col:nth-child(3),
+      // 拆分视图的第二列和第六列
+      &.code-diff-split colgroup col:nth-child(2),
+      &.code-diff-split colgroup col:nth-child(6),
+      td.lines-escape {
+        width: 0; // 不要使用 display: none; 否则会影响布局, 无内容时为 0, 有内容时为 20(猜测可能是根据内容宽度自动调整)
+        /* visibility: hidden; */ // 不要使用 visibility: hidden; 当 escape 有内容时会导致背景颜色丢失, escape 目前用于显示检测 unicode 编码错误的内容
+      }
+      // 修复当 escape 有内容时, 宽度不够的问题
+      &:has(td.lines-escape:not(:empty)) {
+        // 合并视图的第三列
+        &.code-diff-unified colgroup col:nth-child(3),
+        // 拆分视图的第二列和第六列
+        &.code-diff-split colgroup col:nth-child(2),
+        &.code-diff-split colgroup col:nth-child(6),
+        td.lines-escape {
+          width: 20;
+        }
+      }
+      // Gitea 分列视图下默认 100% 宽度的目的是如果单文件只增加或只删除的情况下, 保持无内容的列的宽度一致, 始终保持左右两边的列宽度一致
+      // 保持 Gitea 的默认设置, 不对行号宽度做处理
+      /* &.code-diff-split table {
+        width: auto;
+      } */
+      // 行号宽度
+      // 40px: 长度 = 9999 行
+      // 45px: 长度 = 99999 行
+      // 50px: 长度 = 999999 行
+      // GitHub 在 commit 中的行宽最小为 40px, 但会动态调整, 在 release 和 review 的差异对比中为 50px
+      // 这里折中为 45px 会根据代码行数动态调整, 45px 既不会在行数少时显得太宽, 也可以在大多数情况下保持宽度一致
+      .lines-num {
+        min-width: 45px;
+      }
+      // 合并视图的第四列
+      &.code-diff-unified colgroup col:nth-child(4),
+      // 拆分视图的第三列和第七列, -/+ 保持居中的宽度
+      &.code-diff-split colgroup col:nth-child(3),
+      &.code-diff-split colgroup col:nth-child(7) {
+        width: 20;
+      }
+    }
+    // 修复对比视图内容中的圆角和背景溢出
+    .file-body.file-code {
+      border-radius: 0 0 ${otherThemeVars.border.radius} ${otherThemeVars.border.radius};
+      overflow: hidden;
+    }
+  }
 `;
--- a/styles/components/filelist.ts
+++ b/styles/components/filelist.ts
@@ -58,9 +58,11 @@ export const repoFiles = css`
            .commit-summary {
              color: ${themeVars.color.text.light.num1};
            }
-            img.tw-align-middle {
-              margin-top: -1px;
-              margin-left: 1px;
+            img.ui.avatar {
+              border-radius: 9999px;
+              margin-left: 2px;
+              width: 20px;
+              height: 20px;
            }
            // 作者
            .author-wrapper {
@@ -314,6 +316,10 @@ export const repoFileView = css`
                &:last-of-type {
                  border-top-right-radius: ${otherThemeVars.border.radius};
                  border-bottom-right-radius: ${otherThemeVars.border.radius};
+                  // 与无权限按钮之间的间距
+                  + .btn-octicon.disabled {
+                    margin-left: 8px;
+                  }
                }
                &:hover {
                  background: ${themeVars.color.hover.self};
@@ -333,6 +339,11 @@ export const repoFileView = css`
            .commit-summary {
              color: ${themeVars.color.text.light.num1};
            }
+            > img.ui.avatar {
+              border-radius: 9999px;
+              width: 20px;
+              height: 20px;
+            }
          }
          // 右侧提交时间
          > .age {
@@ -434,7 +445,7 @@ export const repoSidebarBottom = css`
        padding: 16px 0;
        .flex-item {
          padding: 16px 0 0 0;
-          .flex-item-icon {
+          .flex-item-leading {
            svg.svg.octicon-tag {
              color: ${themeVars.color.green.self};
              margin-top: 2px;
--- a/styles/components/heatmap.ts
+++ b/styles/components/heatmap.ts
@@ -77,17 +77,37 @@ export const activity = css`
      padding: 16px;
      > .flex-item-leading {
        img {
-          width: 20px;
-          height: 20px;
+          width: 24px;
+          height: 24px;
+          border-radius: 9999px;
        }
      }
+      // 动态的主要内容
      > .flex-item-main {
        gap: 8px !important;
+        // 动态的标题
        > div:not([class]) {
          display: flex;
-          gap: 8px;
+          align-items: baseline;
+          gap: 6px;
          flex-wrap: wrap;
+          > a {
+            color: ${themeVars.color.text.self};
+            // 不匹配作者
+            &:not([title]) {
+              // 尽量只选中仓库名, 不匹配标签和分支
+              &:not([href*="tag"]):not([href*="branch"]) {
+                color: ${themeVars.color.primary.self};
+                text-decoration: underline;
+              }
+            }
+          }
+          relative-time {
+            color: ${themeVars.color.text.light.num1};
+            font-size: 12px;
+          }
        }
+        // 动态的描述
        > .tw-flex-col {
          gap: 0px !important;
          > .flex-text-block {
@@ -95,8 +115,9 @@ export const activity = css`
            font-size: 12px;
            color: ${themeVars.color.text.light.num1};
            img {
-              width: 14px;
-              height: 14px;
+              width: 16px;
+              height: 16px;
+              border-radius: 9999px;
            }
            .ui.sha.label {
              margin-top: 0;
--- a/styles/components/issue.ts
+++ b/styles/components/issue.ts
@@ -56,6 +56,9 @@ export const issueList = css`
          height: 32px;
        }
      }
+      img.ui.avatar {
+        border-radius: 9999px;
+      }
    }
  }
  // 里程碑详细页面的 Issue 列表
@@ -70,6 +73,9 @@ export const issueList = css`
      border: 1px solid ${themeVars.color.light.border};
      border-bottom-left-radius: ${otherThemeVars.border.radius};
      border-bottom-right-radius: ${otherThemeVars.border.radius};
+      img.ui.avatar {
+        border-radius: 9999px;
+      }
      > .flex-item {
        align-items: center;
        padding: 0;
@@ -176,6 +182,9 @@ export const issuePins = css`
        display: none;
      }
    }
+    img.ui.avatar {
+      border-radius: 9999px;
+    }
  }
 `;

@@ -269,6 +278,9 @@ export const prBranch = css`
 // 评论
 export const comment = css`
  .comment .comment-container {
+    img.ui.avatar {
+      border-radius: 9999px;
+    }
    // 去除评论标题左侧指向头像的小箭头
    .comment-header,
    &:target .comment-header {
@@ -306,9 +318,18 @@ export const comment = css`
      //   display: none;
      // }
      .context-dropdown {
+        height: 28px;
+        padding: 0 6px;
+        border-radius: ${otherThemeVars.border.radius};
+        &:hover {
+          background-color: ${themeVars.github.control.transparent.bgColor.hover};
+        }
        a.context-menu {
          display: flex;
          align-items: center;
+          &:hover {
+            color: inherit;
+          }
        }
        // 评论菜单的删除按钮
        .menu .item.delete-comment {
@@ -326,7 +347,7 @@ export const comment = css`
      align-items: center;
      justify-content: center;
      background: ${themeVars.color.button};
-      border-radius: 25px;
+      border-radius: 9999px;
      border: 1px solid ${themeVars.color.light.border};
      color: ${themeVars.color.text.light.num1};
      padding: 0px 8px !important;
@@ -337,7 +358,7 @@ export const comment = css`
    .bottom-reactions {
      .ui.ui.ui.label {
        background-color: unset !important;
-        border-radius: 25px;
+        border-radius: 9999px;
        border-color: ${themeVars.color.light.border};
        &:hover {
          background-color: ${themeVars.color.reaction.hoverBg} !important;
@@ -392,7 +413,7 @@ export const prMerge = css`
    // 头像
    .timeline-avatar {
      color: ${themeVars.color.white} !important;
-      border-radius: ${otherThemeVars.border.radius};
+      border-radius: 9999px;
      width: 40px;
      height: 40px;
      display: flex;
@@ -405,6 +426,7 @@ export const prMerge = css`
      // 可以合并
      &.green {
        background-color: ${themeVars.github.bgColor.success.emphasis};
+        border-radius: ${otherThemeVars.border.radius};
        // 操作评论边框色
        + .content > .ui.attached.segment {
          border-left-color: ${themeVars.github.bgColor.success.emphasis};
@@ -420,6 +442,7 @@ export const prMerge = css`
      // 已合并
      &.purple {
        background-color: ${themeVars.github.bgColor.done.emphasis};
+        border-radius: ${otherThemeVars.border.radius};
        + .content > .ui.attached.segment {
          border-left-color: ${themeVars.github.bgColor.done.emphasis};
          border-right-color: ${themeVars.github.bgColor.done.emphasis};
@@ -493,6 +516,9 @@ export const timeline = css`
      .timeline-item,
      .timeline-item-group {
        padding: 16px 0;
+        .comment-text-line {
+          color: ${themeVars.color.text.light.num1};
+        }
        // 事件
        &.event {
          // 修复覆盖后的位置问题
@@ -545,6 +571,9 @@ export const issueSidebar = css`
  // 工单&创建工单&PR页面侧边栏
  .page-content.repository.issue {
    .issue-content {
+      img.ui.avatar {
+        border-radius: 9999px;
+      }
      gap: 24px;
      // 侧边栏
      .issue-content-right {
@@ -641,13 +670,22 @@ export const issueSidebar = css`
          }
        }
        // 时间追踪
-        > div:not([class]):not([id]) > .ui.dropdown.jump > a.fixed-text.muted {
-          align-items: center;
-          border-radius: ${otherThemeVars.border.radius};
-          text-decoration-line: none;
-          height: 28px;
-          &:hover {
-            background: ${themeVars.github.control.transparent.bgColor.hover};
+        > div:not([class]):not([id]) {
+          > .flex-text-block {
+            color: ${themeVars.color.text.light.num1};
+          }
+          > .ui.buttons {
+            ${sidebarPadding};
+            .button {
+              height: 30px;
+              min-height: 30px;
+              &:hover {
+                border-color: ${themeVars.color.light.border};
+                + .button {
+                  border-left-color: ${themeVars.color.light.border};
+                }
+              }
+            }
          }
        }
        // 选中日期颜色
@@ -662,7 +700,8 @@ export const issueSidebar = css`
        // 订阅按钮
        .ui.watching .ui.button {
          padding: 0px 8px;
-          height: 28px;
+          height: 30px;
+          min-height: 30px;
          svg {
            margin: 0 !important;
          }
@@ -670,7 +709,7 @@ export const issueSidebar = css`
        // PIN 按钮
        .form-fetch-action.single-button-form .ui.button,
        // 底部操作按钮
-        .ui.show-modal.button {
+        > .ui.show-modal.button {
          border: 0;
          background: unset;
          font-weight: 400;
@@ -699,3 +738,19 @@ export const issueSidebar = css`
    }
  }
 `;
+
+// 工单标题
+export const issueTitle = css`
+  .page-content.repository.issue {
+    .issue-title-header {
+      .issue-title-meta {
+        .issue-state-label {
+          padding: 6px 9px !important;
+        }
+        .time-desc {
+          color: ${themeVars.color.text.light.num1};
+        }
+      }
+    }
+  }
+`;
--- a/styles/components/navbar.ts
+++ b/styles/components/navbar.ts
@@ -83,7 +83,7 @@ export const navbarRight = css`
            }
            // 头像
            img {
-              border-radius: 25px;
+              border-radius: 9999px;
              height: 32px;
              max-height: 32px;
              margin: 0 !important;
@@ -99,7 +99,7 @@ export const navbarRight = css`
        .notification_count,
        .header-stopwatch-dot {
          background-color: ${themeVars.github.bgColor.accent.emphasis};
-          border-radius: 25px;
+          border-radius: 9999px;
          color: ${themeVars.color.white};
          font-size: 9px;
          font-weight: 600;
--- a/styles/components/packages.ts
+++ b/styles/components/packages.ts
@@ -35,7 +35,6 @@ export const packagesList = css`
              font-size: 12px;
              a {
                text-decoration: underline;
-                text-underline-offset: 3px;
              }
            }
          }
@@ -102,7 +101,7 @@ export const packagesDetail = css`
              justify-content: space-between;
              > a {
                border: 1px solid ${themeVars.color.light.border};
-                border-radius: 25px;
+                border-radius: 9999px;
                font-size: 12px;
                padding: 0px 6px;
                min-height: 20px;
--- a/styles/components/release.ts
+++ b/styles/components/release.ts
@@ -105,13 +105,16 @@ export const releases = css`
        // 右侧发布详细信息
        .segment.detail {
          padding: 16px;
+          img.ui.avatar {
+            border-radius: 9999px;
+          }
          .svg {
            color: ${themeVars.color.text.light.num1};
          }
          // 标题
          .release-list-title {
            font-size: 32px;
-            gap: 16px;
+            gap: 8px;
          }
          // 提交信息
          p.text.grey {
@@ -137,13 +140,13 @@ export const releases = css`
            position: relative;
            left: -16px;
            width: calc(100% + 32px);
-            border-top-width: 1.5px;
+            border-top-width: 1px;
            margin: 24px 0 16px 0;
          }
          // 下载列表
          .download {
            summary {
-              font-size: 18px;
+              font-size: 16px;
              font-weight: 600;
              margin-top: 16px;
              &::marker {
--- a/styles/components/repo.ts
+++ b/styles/components/repo.ts
@@ -71,7 +71,7 @@ export const repoTopic = css`
  .flex-item-main > .label-list .ui.label,
  // 仓库文件列表下的 topic 标签
  #repo-topics .ui.label.repo-topic {
-    border-radius: 25px;
+    border-radius: 9999px;
    font-size: 12px;
    font-weight: 500;
    padding: 2.5px 10px;
--- a/styles/components/user.ts
+++ b/styles/components/user.ts
@@ -60,3 +60,16 @@ export const stars = css`
    }
  }
 `;
+
+// 用户信息卡片
+export const profileCard = css`
+  .page-content.user.profile {
+    #profile-avatar-card {
+      #profile-avatar {
+        img.ui.avatar {
+          border-radius: 9999px;
+        }
+      }
+    }
+  }
+`;
--- a/styles/public/animation.ts
+++ b/styles/public/animation.ts
@@ -1,7 +1,16 @@
-import { overlayAppearDown, overlayAppearUp } from "src/core/theme";
+import { overlayAppear, overlayAppearDown, overlayAppearUp } from "src/core/theme";
 import { css } from "src/types/vars";

 export const keyframe = css`
+  // 出现动画
+  @keyframes ${overlayAppear} {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  }
  // 向下出现动画
  @keyframes ${overlayAppearDown} {
    0% {
--- a/styles/public/base.ts
+++ b/styles/public/base.ts
@@ -4,4 +4,7 @@ export const body = css`
  body {
    line-height: 18px;
  }
+  a {
+    text-underline-offset: 0.2rem; // 0.2rem 可以始终保持下划线不受 overflow: hidden 的影响
+  }
 `;
--- a/styles/public/dropdown.ts
+++ b/styles/public/dropdown.ts
@@ -230,7 +230,7 @@ export const selectionDropdown = css`
  // 标签页面的标签选择框
  .page-content.repository.labels .ui.selection.dropdown.active,
  // 创建仓库页面的标签选择框
-  .ui.search.selection.dropdown {
+  .page-content.repository.new-repo .ui.search.selection.dropdown {
    > .menu > .item {
      flex-direction: column;
      align-items: flex-start;
--- a/styles/public/label.ts
+++ b/styles/public/label.ts
@@ -3,68 +3,73 @@ import { css, themeVars } from "src/types/vars";
 export const label = css`
  /* 所有标签, 但不包括 a 标签 */
  /* a 标签比如仓库点星等按钮旁边的数字标签按钮,提交图中的 tag 标签 */
+  div.label,
+  span.label,
+  // 包含多个标签的元素, 比如 Issue/PR 详情页中的时间线上的标签
+  span.labels-list a.label {
+    &.ui.ui.ui {
+      border-radius: 9999px;
+      padding: 1.5px 6px;
+      // 多个标签的组合标签的圆角修复
+      &.scope-parent {
+        .scope-left {
+          border-top-right-radius: 0;
+          border-bottom-right-radius: 0;
+        }
+        .scope-middle {
+          border-radius: 0;
+        }
+        .scope-right {
+          border-top-left-radius: 0;
+          border-bottom-left-radius: 0;
+        }
+      }
+    }
+  }
  div,
  span {
-    &.ui.ui.ui {
-      &.label {
-        border-radius: 25px;
-        padding: 1.5px 6px;
-        // 多个标签的组合标签的圆角修复
-        &.scope-parent {
-          .scope-left {
-            border-top-right-radius: 0;
-            border-bottom-right-radius: 0;
-          }
-          .scope-middle {
-            border-radius: 0;
-          }
-          .scope-right {
-            border-top-left-radius: 0;
-            border-bottom-left-radius: 0;
-          }
-        }
-        /* 主色调标签 */
-        &.primary {
-          background-color: unset;
-          border: 1px solid ${themeVars.color.primary.self};
-          color: ${themeVars.color.primary.self};
-        }
-        /* 红色标签 */
-        &.red {
-          background-color: unset;
-          border: 1px solid ${themeVars.github.borderColor.done.emphasis};
-          color: ${themeVars.color.purple.self};
-        }
-        /* 橙色标签 */
-        &.orange {
-          background-color: unset;
-          border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
-          color: ${themeVars.color.yellow.self};
-        }
-        /* 黄色标签 */
-        &.yellow {
-          background-color: unset;
-          border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
-          color: ${themeVars.color.orange.self};
-        }
-        /* 黄绿色标签 */
-        &.olive {
-          background-color: unset;
-          border: 1px solid ${themeVars.color.olive.self};
-          color: ${themeVars.color.olive.self};
-        }
-        /* 绿色标签 */
-        &.green {
-          background-color: unset;
-          border: 1px solid ${themeVars.github.borderColor.success.emphasis};
-          color: ${themeVars.color.green.self};
-        }
-        /* 紫色标签 */
-        &.purple {
-          background-color: unset;
-          border: 1px solid ${themeVars.github.borderColor.done.emphasis};
-          color: ${themeVars.color.purple.self};
-        }
+    &.ui.ui.ui.label {
+      /* 主色调标签 */
+      &.primary {
+        background-color: unset;
+        border: 1px solid ${themeVars.color.primary.self};
+        color: ${themeVars.color.primary.self};
+      }
+      /* 红色标签 */
+      &.red {
+        background-color: unset;
+        border: 1px solid ${themeVars.github.borderColor.done.emphasis};
+        color: ${themeVars.color.purple.self};
+      }
+      /* 橙色标签 */
+      &.orange {
+        background-color: unset;
+        border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
+        color: ${themeVars.color.yellow.self};
+      }
+      /* 黄色标签 */
+      &.yellow {
+        background-color: unset;
+        border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
+        color: ${themeVars.color.orange.self};
+      }
+      /* 黄绿色标签 */
+      &.olive {
+        background-color: unset;
+        border: 1px solid ${themeVars.color.olive.self};
+        color: ${themeVars.color.olive.self};
+      }
+      /* 绿色标签 */
+      &.green {
+        background-color: unset;
+        border: 1px solid ${themeVars.github.borderColor.success.emphasis};
+        color: ${themeVars.color.green.self};
+      }
+      /* 紫色标签 */
+      &.purple {
+        background-color: unset;
+        border: 1px solid ${themeVars.github.borderColor.done.emphasis};
+        color: ${themeVars.color.purple.self};
      }
    }
  }
@@ -102,6 +107,9 @@ export const shaLabel = css`
        margin-left: 5px;
        height: 25px;
      }
+      img.ui.avatar {
+        border-radius: 9999px;
+      }
    }
  }
  // 修复带验证的提交 SHA 标签的高度
--- a/styles/public/other.ts
+++ b/styles/public/other.ts
@@ -22,3 +22,12 @@ export const svg = css`
    color: #429cf0 !important;
  }
 `;
+
+export const avatar = css`
+  img.ui.avatar,
+  .ui.avatar img,
+  .ui.avatar svg {
+    background-color: ${themeVars.github.avatar.bgColor};
+    box-shadow: 0 0 0 1px ${themeVars.github.avatar.borderColor};
+  }
+`;
--- a/styles/public/tippy.ts
+++ b/styles/public/tippy.ts
@@ -1,4 +1,4 @@
-import { animationDown } from "src/core/theme";
+import { animation, animationDown } from "src/core/theme";
 import { css, otherThemeVars, themeVars } from "src/types/vars";

 // 一些界面内的提示框, 比如克隆按钮, PR信息, Runner信息 等
@@ -43,6 +43,7 @@ export const tippyBox = css`
    }
    // 专门用于提示信息的提示框, 比如提交的具体时间, 任务状态等
    &[data-theme="tooltip"] {
+      ${animation};
      .tippy-content {
        font-size: 12px;
        font-weight: 400;
--- a/themes/colorblind-dark.css.ts
+++ b/themes/colorblind-dark.css.ts
@@ -9,6 +9,7 @@ import { darkGithubColors } from "themes/dark";

 export const colorblindDarkGithubColors: GithubColor = {
  isDarkTheme: true,
+  avatar: darkGithubColors.avatar,
  display: darkGithubColors.display,
  diffBlob: {
    addtionNum: { bgColor: "#58a6ff4d" },
--- a/themes/colorblind-light.css.ts
+++ b/themes/colorblind-light.css.ts
@@ -9,6 +9,7 @@ import { lightGithubColors } from "themes/light";

 export const colorblindLightGithubColors: GithubColor = {
  isDarkTheme: false,
+  avatar: lightGithubColors.avatar,
  display: lightGithubColors.display,
  diffBlob: {
    addtionNum: { bgColor: "#b6e3ff" },
--- a/themes/dark.css.ts
+++ b/themes/dark.css.ts
@@ -7,6 +7,10 @@ import { github2ThemeColor, type GithubColor } from "src/core/github";

 export const darkGithubColors: GithubColor = {
  isDarkTheme: true,
+  avatar: {
+    bgColor: "#ffffff1a",
+    borderColor: "#ffffff26",
+  },
  display: {
    blue: { fgColor: "#4493f8" },
    brown: { fgColor: "#b69a6d" },
--- a/themes/light.css.ts
+++ b/themes/light.css.ts
@@ -7,6 +7,10 @@ import { github2ThemeColor, type GithubColor } from "src/core/github";

 export const lightGithubColors: GithubColor = {
  isDarkTheme: false,
+  avatar: {
+    bgColor: "#ffffff",
+    borderColor: "#1f232826",
+  },
  display: {
    blue: { fgColor: "#0969da" },
    brown: { fgColor: "#755f43" },
--- a/themes/soft-dark.css.ts
+++ b/themes/soft-dark.css.ts
@@ -9,6 +9,10 @@ import { darkGithubColors } from "themes/dark";

 export const softDarkGithubColors: GithubColor = {
  isDarkTheme: true,
+  avatar: {
+    bgColor: "#cdd9e51a",
+    borderColor: "#cdd9e526",
+  },
  display: darkGithubColors.display,
  diffBlob: {
    addtionNum: { bgColor: "#57ab5a4d" },
Author	SHA1	Message	Date
lutinglt	4ae9a2754f	Optimize the workflow log page style	2025-11-06 19:24:51 +08:00
lutinglt	914d5228e3	perf action step container	2025-11-06 18:05:12 +08:00
lutinglt	efec911021	Fix fixed height when scrolling through step titles on workflow detail pages	2025-11-06 17:43:10 +08:00
lutinglt	5e3f2ec2c2	Fix the disabled operation button interval in the code preview interface	2025-11-06 17:36:09 +08:00
lutinglt	ce1ebf0c53	h3 -> h4	2025-11-06 10:18:45 +08:00
lutinglt	63e05b09b1	update readme	2025-11-06 10:16:23 +08:00
lutinglt	2d0da89248	update issue order	2025-11-06 10:11:52 +08:00
lutinglt	687c7711ae	update issue	2025-11-06 10:10:40 +08:00
lutinglt	1cf6252847	readme change	2025-11-06 09:31:26 +08:00
lutinglt	3851dc2449	fix code	2025-11-06 09:26:02 +08:00
lutinglt	adfa315484	修复差异对比下当有 unicode 字符提示时丢失的背景颜色和宽度问题	2025-11-05 18:49:12 +08:00
lutinglt	d91e6223dd	version change	2025-11-05 09:08:58 +08:00
lutinglt	55cbf235d5	release	2025-11-05 09:05:20 +08:00
lutinglt	976949aa2e	修复对比视图内容中的圆角和背景溢出	2025-11-04 13:45:01 +08:00
lutinglt	0a7d5970c9	优化 diff 的行号宽度调整逻辑	2025-11-02 12:18:43 +08:00
lutinglt	98630773fb	diff 代码行高度微调	2025-11-02 11:20:01 +08:00
lutinglt	f71dccb0c1	同步差异对比代码块的样式	2025-11-01 23:27:17 +08:00
lutinglt	925068c962	fix underline-offset	2025-11-01 21:59:15 +08:00
lutinglt	2901ef5fef	0.2rem -> 3.2px	2025-11-01 21:45:13 +08:00
lutinglt	4ac74837b3	全局 a 标签下划线偏移	2025-11-01 21:36:30 +08:00
lutinglt	b8c6eced7f	changelog	2025-11-01 18:53:46 +08:00
lutinglt	a8a3cd5546	优化提示框动画速度	2025-11-01 18:51:02 +08:00
lutinglt	41e209c257	+1	2025-11-01 15:56:17 +08:00
lutinglt	d22c46e96f	perf activity hover underline	2025-11-01 15:53:03 +08:00
lutinglt	97f602435c	修复仓库代码页的发布图标颜色	2025-11-01 14:19:12 +08:00
lutinglt	fede39c6eb	同步字符提示的提示框动画	2025-11-01 14:16:36 +08:00
lutinglt	493657bcb5	优化 Diff/Actions 的三点菜单按钮样式	2025-11-01 14:08:02 +08:00
lutinglt	e537b75bad	修复 Issue/PR 详细页面中时间线上的标签样式	2025-11-01 13:49:37 +08:00
lutinglt	07c6f0a78e	修复一些选择输入框的排列问题	2025-11-01 13:36:27 +08:00
lutinglt	b057060b05	fix readme	2025-10-31 23:23:14 +08:00
lutinglt	394a53d963	update screenshot	2025-10-31 23:21:48 +08:00
lutinglt	0f7a1d85c9	test readme	2025-10-31 22:49:00 +08:00
lutinglt	baa59d60a7	update screenshot	2025-10-31 22:43:54 +08:00
lutinglt	a62f65700c	update screenshot	2025-10-31 22:39:56 +08:00
lutinglt	f2580e6c77	优化用户动态页	2025-10-31 19:11:13 +08:00
lutinglt	7f51f4b2eb	同步最后一次提交信息中的头像大小	2025-10-31 15:41:57 +08:00
lutinglt	93485dc5f7	头像和动态样式 & Issue 样式修复	2025-10-31 12:51:50 +08:00