Compare commits

...

90 Commits

Author SHA1 Message Date
lutinglt
de0cac06b2 1.25.3 release 2025-12-22 20:09:01 +08:00
lutinglt
bd7899114b Optimize the width of the left side of the workflow details page in different zoom levels 2025-12-10 10:21:14 +08:00
lutinglt
9c67ea1697 fix ci 2025-12-05 09:35:55 +08:00
lutinglt
4a60775c32 vite 8.0 2025-12-05 09:29:26 +08:00
lutinglt
d27376a800 typescript 7.0 (tsgo) 2025-12-04 15:38:22 +08:00
lutinglt
6494e4468b optimize readme header 2025-12-04 11:25:43 +08:00
lutinglt
1729cfe2df fix ci 2025-12-03 11:39:20 +08:00
lutinglt
7a4851eb21 optimize action view 2025-12-03 10:56:46 +08:00
lutinglt
a0b51b863d tmpl Handlebars 2025-12-02 22:18:04 +08:00
lutinglt
13cd887d97 add translate 2025-12-02 17:33:57 +08:00
lutinglt
824eb26f1d build 2025-12-02 14:41:44 +08:00
lutinglt
6a0a92cd94 build test 2025-12-02 14:39:12 +08:00
lutinglt
76e547987b build test 2025-12-02 14:37:32 +08:00
lutinglt
86e488aafb fix issue/pr element styles 2025-12-02 13:43:36 +08:00
lutinglt
b3cc3ab82f sign badge icon -> font 2025-11-30 14:15:34 +08:00
lutinglt
f2787efcd9 optimize sign badge style 2025-11-30 12:09:21 +08:00
lutinglt
2b2f2e8a1e format 2025-11-29 21:14:51 +08:00
lutinglt
2a95d85fb6 fix commit sign badge style 2025-11-29 21:12:38 +08:00
lutinglt
e2838df051 Supplement the PR operation panel status style in PR 2025-11-29 21:04:40 +08:00
lutinglt
c1a0f96b6c optimize commit style 2025-11-29 20:04:31 +08:00
lutinglt
3084a5f54e Synchronized repository commit page layout and styles 2025-11-29 18:09:27 +08:00
lutinglt
ca7207db06 update readme 2025-11-28 19:30:41 +08:00
lutinglt
7d5c600f18 rc version 2025-11-28 16:17:16 +08:00
lutinglt
24f541180f Optimize menu item & code block styles 2025-11-28 16:11:37 +08:00
lutinglt
15d741ff66 optimize latest commit style 2025-11-28 11:51:42 +08:00
lutinglt
91ef8da69c remove pr button 2025-11-27 18:23:46 +08:00
lutinglt
47519afe4a Synchronized repository template 2025-11-27 17:50:57 +08:00
lutinglt
2da9dda3af Fixed extra lines under heatmap 2025-11-23 12:22:09 +08:00
lutinglt
8216986aef version change 2025-11-23 11:11:49 +08:00
lutinglt
f91d295b42 1.25.2 2025-11-23 11:07:46 +08:00
lutinglt
6e3f207c6c Fix the spacing of Issue WIP prompts 2025-11-22 17:46:45 +08:00
lutinglt
5c36998d5e release templates 2025-11-21 14:31:31 +08:00
lutinglt
a83fe43cbb Navigation bar Issue & PR moved to the right side. 2025-11-21 14:28:40 +08:00
lutinglt
678beb2c0d Optimize pr branch label 2025-11-13 20:44:55 +08:00
lutinglt
fd12236144 Optimize top navbar style on mobile 2025-11-13 20:32:45 +08:00
lutinglt
f33a0ae81c Optimize action list line height 2025-11-13 18:40:52 +08:00
鲁汀
a1d531ba36 Remove Downloads History from README
Removed Downloads History section and associated images.
2025-11-12 00:10:40 +08:00
lutinglt
32d0274b56 star history 2025-11-09 23:14:30 +08:00
lutinglt
74c98fbd5d update 2025-11-09 23:07:23 +08:00
lutinglt
d6567618d9 update readme 2025-11-09 23:04:29 +08:00
lutinglt
0cc4f61984 update readme 2025-11-09 22:59:42 +08:00
lutinglt
fd20862833 add --color-logo 2025-11-09 22:15:45 +08:00
lutinglt
ea49cf94dd Fix packages details page style 2025-11-09 10:04:35 +08:00
lutinglt
4fd01c50b0 Optimize organization detail page style 2025-11-09 09:50:25 +08:00
lutinglt
f500f2aae3 remove org label style 2025-11-08 23:56:21 +08:00
lutinglt
b220a17829 fix label 2025-11-08 23:51:20 +08:00
lutinglt
0a0cd77b3f Optimize repository header name style 2025-11-08 20:38:26 +08:00
lutinglt
aa36f52d83 Optimize repository header style 2025-11-08 20:37:23 +08:00
lutinglt
a841636737 Optimize global line height 2025-11-08 20:09:13 +08:00
lutinglt
fb1ebd6f18 fuck issue 2025-11-07 09:00:54 +08:00
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
lutinglt
90b618688b 1.25.0 2025-10-30 22:07:41 +08:00
lutinglt
6ddc5057a4 update readme 2025-10-25 15:25:19 +08:00
lutinglt
ceb0fd0b0c version change 2025-10-25 13:07:09 +08:00
84 changed files with 2892 additions and 767 deletions

View File

@@ -14,5 +14,5 @@ trim_trailing_whitespace = true
max_line_length = 120
# documentation, utils
[*.{md,mdx,diff}]
[*.{md,diff}]
trim_trailing_whitespace = false

View File

@@ -5,4 +5,6 @@ SSH_SERVER=localhost
# 上传到服务器的用户名称, 不支持密码, 请确保有 SSH 免密登录权限
SSH_USER=root
# 上传到服务器的主题路径, 请使用绝对路径
GITEA_THEME_PATH=/data/gitea/public/assets/css/
GITEA_THEME_PATH=/data/gitea/public/assets/css/
# Gitea 数据路径, 用于上传到服务器的模板路径, 请使用绝对路径
GITEA_PATH=/data/gitea/

6
.gitattributes vendored
View File

@@ -1,5 +1 @@
.github/* linguist-vendored
.vscode/* linguist-vendored
screenshots/* linguist-vendored
scripts/* linguist-vendored
eslint.config.js linguist-vendored
*.tmpl linguist-language=Handlebars

View File

@@ -6,7 +6,9 @@
### 🌈 Style
##### 更符合 GitHub 风格
#### 更符合 GitHub 风格
##### 模板文件
### 🐞 Fix
@@ -14,7 +16,9 @@
#### CSS Variable
##### More GitHub-like style
#### More GitHub-like style
##### Template File
```text
在 English 下方补充上面 Feature 以下部分的内容的中译英​

View File

@@ -1,91 +1,91 @@
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 )
!!! Please read the readme and ensure that the theme is used correctly before submitting !!!
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

View File

@@ -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

View File

@@ -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

12
.github/ISSUE_TEMPLATE/3-doc-report.yml vendored Normal file
View File

@@ -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

View File

@@ -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

View File

@@ -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

56
.github/workflows/build.yml vendored Normal file
View File

@@ -0,0 +1,56 @@
name: build
on:
push:
branches:
- main
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: dorny/paths-filter@v3
id: changes
with:
filters: |
src:
- "scripts/*"
- "src/**/*.ts"
- "styles/**/*.ts"
- "themes/*.css.ts"
- "vite.config.ts"
- "package.json"
- name: Build theme
id: build
if: steps.changes.outputs.src == 'true'
run: |
npm run install:vite8
npm run build
- name: Upload css assets
if: steps.build.outcome == 'success'
uses: actions/upload-artifact@v4
with:
name: themes
path: dist/*.css
- name: Upload templates assets
if: steps.build.outcome == 'success'
uses: actions/upload-artifact@v4
with:
name: templates
path: templates
- name: Build locales
id: locales
if: steps.build.outcome =='success'
run: npm run tr
- name: Upload locales assets
if: steps.locales.outcome =='success'
uses: actions/upload-artifact@v4
with:
name: locales
path: dist/options/locale

View File

@@ -13,8 +13,8 @@ jobs:
- uses: actions/checkout@v4
- name: Build theme
run: |
npm install
npm run build
npm run install:vite8
npm run release
- name: Create release
run: |
tar -zcf dist/theme-github-base.tar.gz --remove-files \
@@ -29,7 +29,9 @@ jobs:
tar -zcf dist/theme-github-extra-pink.tar.gz --remove-files \
dist/theme-github-pink-auto.css dist/theme-github-pink-light.css dist/theme-github-pink-dark.css dist/theme-github-pink-soft-dark.css
tar -zcf dist/theme-github-templates.tar.gz templates
tar -zcf dist/theme-github-translations.tar.gz --remove-files dist/options
TAG="v$(npm run -s version)"
gh release create "$TAG" dist/* --notes-file CHANGELOG.md --draft -t $TAG
gh release create "$TAG" dist/*.tar.gz --notes-file CHANGELOG.md --draft -t $TAG
env:
GH_TOKEN: ${{ github.token }}

View File

@@ -4,6 +4,7 @@
"dbaeumer.vscode-eslint",
"usernamehw.errorlens",
"mikestead.dotenv",
"styled-components.vscode-styled-components"
"styled-components.vscode-styled-components",
"typescriptteam.native-preview"
]
}

3
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,3 @@
{
"typescript.experimental.useTsgo": false
}

View File

@@ -1,51 +1,21 @@
### 🌈 Style
- 优化顶部和二级导航栏的样式和颜色 #18
#### More aligned with GitHub style
##### 更符合 GitHub 风格
- Optimize the selection style of items in the menu.
- Optimize code block styles.
- Optimize some element styles on Issue/PR page.
- Optimize the width of the left side of the workflow details page in different zoom levels.
- 修复并同步工单或 PR 详细页面下的标签菜单样式 #19
- 统一仓库/用户/组织列表无搜索结果时的样式 #20
- 同步页脚样式
- 优化下拉菜单的样式
- 优化创建标签菜单的菜单项的样式
- 同步亮色和柔和暗色主题下的菜单颜色
- 同步工作流运行页面的运行时间字体样式和重新运行按钮样式
- VSCode 和 VSCodium 图标添加颜色
##### Template File
- Synchronized repository commit page layout and styles.
- Synchronized repository code list page layout and styles.
- Synchronized repository add file button menu styles.
### 🐞 Fix
- 修复 Wiki 页面搜索项目没有正确隐藏的问题 #15
- 修复后台账户管理排序菜单项的宽度问题
- 修复合并提交中的主色调按钮组阴影问题
- 修复仓库页面下二级导航栏下划线过粗的问题
- 修复仪表板切换用户按钮菜单下无创建组织按钮时的菜单圆角问题
- 修复导航栏工单/PR等仪表板下筛选等菜单的子项的间距问题
- 修复手机下仪表板二级导航栏用户菜单按钮没有居中的问题
## 📃 English
### 🌈 Style
- Optimized styles and colors for top and secondary navigation bars #18
##### More aligned with GitHub style
- Fixed and synchronized label menu styles under issue or PR detail pages #19
- Unified styles for repository/user/organization lists when no search results are found #20
- Synchronized footer styles
- Optimized dropdown menu styles
- Optimized menu item styles for creating label menus
- Synchronized menu colors in light and soft dark themes
- Synchronized font styles for run time and rerun button styles on workflow run pages
- Added colors to VSCode and VSCodium icons
### 🐞 Fix
- Fixed issue where Wiki page search items were not properly hidden #15
- Fixed width issue for sorting menu items in admin account management
- Fixed shadow issue for primary color button groups in merge commits
- Fixed issue where underlines in secondary navigation bars on repository pages were too thick
- Fixed menu corner radius issue when no create organization button exists under dashboard user switching button menu
- Fixed spacing issue for sub-items in filter menus under navigation bar issues/PRs dashboards
- Fixed issue where user menu buttons in secondary navigation bars on mobile dashboards were not centered
- Fixed extra lines under heatmap.
- Supplement the PR operation panel status style in PR.
- Fixed avatar size for approving users in PR
- Fixed bot label styles in Issue/PR

159
README.md
View File

@@ -6,67 +6,83 @@
<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 `data/gitea/public/assets/css` directory
(This directory may not be available by default and needs to be manually created)
2. Modify `data/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
> [!IMPORTANT]
>
> 自动颜色主题需要亮色和暗色的主题文件
Example: If the theme filename is `theme-github-dark.css`, add `github-dark` to the end of `THEMES`
例: 主题文件名为 `theme-github-dark.css`,则添加 `github-dark``THEMES` 末尾
`gitea/conf/app.ini` 例:
Example `data/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.
### 基本主题
### Template File Installation (Optional)
1. Download the latest template files from the release page and place them in the `data/gitea/templates` directory (This
directory may not be available by default and needs to be manually created)
2. Restart Gitea
> [!IMPORTANT]
>
> The template modifies Gitea's layout to make it closer to GitHub's layout. Do not use template files across versions,
> as this may lead to missing functionality and other issues.
## Screenshots
### Basic Themes
```ini
THEMES = github-auto, github-light, github-dark, github-soft-dark
@@ -75,14 +91,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 +106,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 +122,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 +146,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 +179,15 @@ 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`
## Star History
<a href="https://www.star-history.com/#lutinglt/gitea-github-theme&type=date&legend=top-left">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=lutinglt/gitea-github-theme&type=date&theme=dark&legend=top-left" />
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=lutinglt/gitea-github-theme&type=date&legend=top-left" />
<img alt="Star History Chart" src="https://api.star-history.com/svg?repos=lutinglt/gitea-github-theme&type=date&legend=top-left" />
</picture>
</a>

173
README_CN.md Normal file
View File

@@ -0,0 +1,173 @@
<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 主题文件放入 `data/gitea/public/assets/css` 目录下 (默认可能没有此目录需手动创建)
2. 修改 `data/gitea/conf/app.ini`,并将 CSS 文件名去掉 `theme-` 的名称附加到 `[ui]` 下的 `THEMES` 末尾
3. 重启 Gitea
4. 在设置中查看主题
例: 主题文件名为 `theme-github-dark.css`,则添加 `github-dark``THEMES` 末尾
`data/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]
>
> 自动颜色主题需要亮色和暗色的主题文件
### 模板文件安装 (可选)
1. 在发布页下载最新的模板文件放入 `data/gitea/templates` 目录下 (默认可能没有此目录需手动创建)
2. 重启 Gitea
> [!IMPORTANT]
>
> 模板修改了 Gitea 的布局, 使其更接近 GitHub 的布局, 请勿跨版本使用模板文件, 可能会导致功能缺失等问题
## 截图
### 基本主题
```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` 末尾

View File

@@ -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
> [!IMPORTANT]
>
> Automatic color theme requires both light and dark theme files.
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)
## 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`

View File

@@ -1,15 +1,14 @@
import js from "@eslint/js";
import { defineConfig } from "eslint/config";
import globals from "globals";
import tseslint from "typescript-eslint";
export default tseslint.config(
{ ignores: ["dist"] },
{
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ["**/*.{ts}"],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
}
);
export default defineConfig({
ignores: ["dist"],
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ["**/*.{ts}"],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
});

1
gitea/README.md Normal file
View File

@@ -0,0 +1 @@
模板的原始文件

View File

@@ -0,0 +1,180 @@
<nav id="navbar" aria-label="{{ctx.Locale.Tr "aria.navbar"}}">
<div class="navbar-left">
<!-- the logo -->
<a class="item" id="navbar-logo" href="{{AppSubUrl}}/" aria-label="{{if .IsSigned}}{{ctx.Locale.Tr "dashboard"}}{{else}}{{ctx.Locale.Tr "home"}}{{end}}">
<img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{ctx.Locale.Tr "logo"}}" aria-hidden="true">
</a>
<!-- mobile right menu, it must be here because in mobile view, each item is a flex column, the first item is a full row column -->
<div class="ui secondary menu navbar-mobile-right only-mobile">
{{template "base/head_navbar_icons" dict "PageGlobalData" .PageGlobalData}}
<button class="item ui icon mini button tw-m-0" id="navbar-expand-toggle" aria-label="{{ctx.Locale.Tr "home.nav_menu"}}">{{svg "octicon-three-bars"}}</button>
</div>
<!-- navbar links non-mobile -->
{{if and .IsSigned .MustChangePassword}}
{{/* No links */}}
{{else if .IsSigned}}
{{if not ctx.Consts.RepoUnitTypeIssues.UnitGlobalDisabled}}
<a class="item{{if .PageIsIssues}} active{{end}}" href="{{AppSubUrl}}/issues">{{ctx.Locale.Tr "issues"}}</a>
{{end}}
{{if not ctx.Consts.RepoUnitTypePullRequests.UnitGlobalDisabled}}
<a class="item{{if .PageIsPulls}} active{{end}}" href="{{AppSubUrl}}/pulls">{{ctx.Locale.Tr "pull_requests"}}</a>
{{end}}
{{if not (and ctx.Consts.RepoUnitTypeIssues.UnitGlobalDisabled ctx.Consts.RepoUnitTypePullRequests.UnitGlobalDisabled)}}
{{if .ShowMilestonesDashboardPage}}
<a class="item{{if .PageIsMilestonesDashboard}} active{{end}}" href="{{AppSubUrl}}/milestones">{{ctx.Locale.Tr "milestones"}}</a>
{{end}}
{{end}}
<a class="item{{if .PageIsExplore}} active{{end}}" href="{{AppSubUrl}}/explore/repos">{{ctx.Locale.Tr "explore"}}</a>
{{else if .IsLandingPageOrganizations}}
<a class="item{{if .PageIsExplore}} active{{end}}" href="{{AppSubUrl}}/explore/organizations">{{ctx.Locale.Tr "explore"}}</a>
{{else}}
<a class="item{{if .PageIsExplore}} active{{end}}" href="{{AppSubUrl}}/explore/repos">{{ctx.Locale.Tr "explore"}}</a>
{{end}}
{{template "custom/extra_links" .}}
{{if not .IsSigned}}
<a class="item" target="_blank" rel="noopener noreferrer" href="https://docs.gitea.com">{{ctx.Locale.Tr "help"}}</a>
{{end}}
</div>
<!-- the full dropdown menus -->
<div class="navbar-right">
{{if and .IsSigned .MustChangePassword}}
<div class="ui dropdown jump item" data-tooltip-content="{{ctx.Locale.Tr "user_profile_and_more"}}">
<span class="text">
{{ctx.AvatarUtils.Avatar .SignedUser 24 "tw-mr-1"}}
<span class="only-mobile">{{.SignedUser.Name}}</span>
<span class="not-mobile">{{svg "octicon-triangle-down"}}</span>
</span>
<div class="menu user-menu">
<div class="header">
{{ctx.Locale.Tr "signed_in_as"}} <strong>{{.SignedUser.Name}}</strong>
</div>
<div class="divider"></div>
<a class="item link-action" href data-url="{{AppSubUrl}}/user/logout">
{{svg "octicon-sign-out"}}
{{ctx.Locale.Tr "sign_out"}}
</a>
</div><!-- end content avatar menu -->
</div><!-- end dropdown avatar menu -->
{{else if .IsSigned}}
{{template "base/head_navbar_icons" dict "ItemExtraClass" "not-mobile" "PageGlobalData" .PageGlobalData}}
<div class="ui dropdown jump item" data-tooltip-content="{{ctx.Locale.Tr "create_new"}}">
<span class="text">
{{svg "octicon-plus"}}
<span class="not-mobile">{{svg "octicon-triangle-down"}}</span>
<span class="only-mobile">{{ctx.Locale.Tr "create_new"}}</span>
</span>
<div class="menu">
<a class="item" href="{{AppSubUrl}}/repo/create">
{{svg "octicon-plus"}} {{ctx.Locale.Tr "new_repo"}}
</a>
{{if not .DisableMigrations}}
<a class="item" href="{{AppSubUrl}}/repo/migrate">
{{svg "octicon-repo-push"}} {{ctx.Locale.Tr "new_migrate"}}
</a>
{{end}}
{{if .SignedUser.CanCreateOrganization}}
<a class="item" href="{{AppSubUrl}}/org/create">
{{svg "octicon-organization"}} {{ctx.Locale.Tr "new_org"}}
</a>
{{end}}
</div><!-- end content create new menu -->
</div><!-- end dropdown menu create new -->
<div class="ui dropdown jump item" data-tooltip-content="{{ctx.Locale.Tr "user_profile_and_more"}}">
<span class="text">
{{ctx.AvatarUtils.Avatar .SignedUser 24 "tw-mr-1"}}
<span class="only-mobile">{{.SignedUser.Name}}</span>
<span class="not-mobile">{{svg "octicon-triangle-down"}}</span>
</span>
<div class="menu user-menu">
<div class="header">
{{ctx.Locale.Tr "signed_in_as"}} <strong>{{.SignedUser.Name}}</strong>
</div>
<div class="divider"></div>
<a class="item" href="{{.SignedUser.HomeLink}}">
{{svg "octicon-person"}}
{{ctx.Locale.Tr "your_profile"}}
</a>
{{if not .DisableStars}}
<a class="item" href="{{.SignedUser.HomeLink}}?tab=stars">
{{svg "octicon-star"}}
{{ctx.Locale.Tr "your_starred"}}
</a>
{{end}}
<a class="item" href="{{AppSubUrl}}/notifications/subscriptions">
{{svg "octicon-bell"}}
{{ctx.Locale.Tr "notification.subscriptions"}}
</a>
<a class="{{if .PageIsUserSettings}}active {{end}}item" href="{{AppSubUrl}}/user/settings">
{{svg "octicon-tools"}}
{{ctx.Locale.Tr "your_settings"}}
</a>
<a class="item" target="_blank" rel="noopener noreferrer" href="https://docs.gitea.com">
{{svg "octicon-question"}}
{{ctx.Locale.Tr "help"}}
</a>
{{if .IsAdmin}}
<div class="divider"></div>
<a class="{{if .PageIsAdmin}}active {{end}}item" href="{{AppSubUrl}}/-/admin">
{{svg "octicon-server"}}
{{ctx.Locale.Tr "admin_panel"}}
</a>
{{end}}
<div class="divider"></div>
<a class="item link-action" href data-url="{{AppSubUrl}}/user/logout">
{{svg "octicon-sign-out"}}
{{ctx.Locale.Tr "sign_out"}}
</a>
</div><!-- end content avatar menu -->
</div><!-- end dropdown avatar menu -->
{{else}}
{{if .ShowRegistrationButton}}
<a class="item{{if .PageIsSignUp}} active{{end}}" href="{{AppSubUrl}}/user/sign_up">
{{svg "octicon-person"}}
<span class="tw-ml-1">{{ctx.Locale.Tr "register"}}</span>
</a>
{{end}}
<a class="item{{if .PageIsSignIn}} active{{end}}" rel="nofollow" href="{{AppSubUrl}}/user/login{{if not .PageIsSignIn}}?redirect_to={{.CurrentURL}}{{end}}">
{{svg "octicon-sign-in"}}
<span class="tw-ml-1">{{ctx.Locale.Tr "sign_in"}}</span>
</a>
{{end}}
</div><!-- end full right menu -->
{{$activeStopwatch := and .PageGlobalData (call .PageGlobalData.GetActiveStopwatch)}}
{{if $activeStopwatch}}
<div class="active-stopwatch-popup tippy-target">
<div class="tw-flex tw-items-center tw-gap-2 tw-p-3">
<a class="stopwatch-link tw-flex tw-items-center tw-gap-2 muted" href="{{$activeStopwatch.IssueLink}}">
{{svg "octicon-issue-opened" 16}}
<span class="stopwatch-issue">{{$activeStopwatch.RepoSlug}}#{{$activeStopwatch.IssueIndex}}</span>
</a>
<div class="tw-flex tw-gap-1">
<form class="stopwatch-commit form-fetch-action" method="post" action="{{$activeStopwatch.IssueLink}}/times/stopwatch/stop">
{{.CsrfTokenHtml}}
<button
type="submit"
class="ui button mini compact basic icon tw-mr-0"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.stop_tracking"}}"
>{{svg "octicon-square-fill"}}</button>
</form>
<form class="stopwatch-cancel form-fetch-action" method="post" action="{{$activeStopwatch.IssueLink}}/times/stopwatch/cancel">
{{.CsrfTokenHtml}}
<button
type="submit"
class="ui button mini compact basic icon tw-mr-0"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.cancel_tracking"}}"
>{{svg "octicon-trash"}}</button>
</form>
</div>
</div>
</div>
{{end}}
</nav>

View File

@@ -0,0 +1,25 @@
{{- $itemExtraClass := .ItemExtraClass -}}
{{- $data := .PageGlobalData -}}
{{if and $data $data.IsSigned}}{{/* data may not exist, for example: rendering 503 page before the PageGlobalData middleware */}}
{{- $activeStopwatch := call $data.GetActiveStopwatch -}}
{{- $notificationUnreadCount := call $data.GetNotificationUnreadCount -}}
{{if $activeStopwatch}}
<a class="item active-stopwatch {{$itemExtraClass}}" href="{{$activeStopwatch.IssueLink}}" title="{{ctx.Locale.Tr "active_stopwatch"}}" data-seconds="{{$activeStopwatch.Seconds}}">
<div class="tw-relative">
{{svg "octicon-stopwatch"}}
<span class="header-stopwatch-dot"></span>
</div>
</a>
{{end}}
<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/notifications" data-tooltip-content="{{ctx.Locale.Tr "notifications"}}">
<div class="tw-relative">
{{svg "octicon-bell"}}
<span class="notification_count{{if not $notificationUnreadCount}} tw-hidden{{end}}">{{$notificationUnreadCount}}</span>
</div>
</a>
{{if $data.IsSiteAdmin}}
<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/-/admin" data-tooltip-content="{{ctx.Locale.Tr "admin_panel"}}">
{{svg "octicon-server"}}
</a>
{{end}}
{{end}}

View File

@@ -0,0 +1,81 @@
{{/* Template attributes:
* Commit
* CommitBaseLink
* CommitSignVerification
If you'd like to modify this template, you could test it on the devtest page.
ATTENTION: this template could be re-rendered many times (on the graph and commit list page),
so this template should be kept as small as possible, DO NOT put large components like modal/dialog into it.
*/}}
{{- $commit := $.Commit -}}
{{- $commitBaseLink := $.CommitBaseLink -}}
{{- $verification := $.CommitSignVerification -}}{{- /* asymkey.CommitVerification */ -}}
{{- $extraClass := "" -}}
{{- $verified := false -}}
{{- $signingUser := NIL -}}
{{- $signingEmail := "" -}}
{{- $msgReasonPrefix := "" -}}
{{- $msgReason := "" -}}
{{- $msgSigningKey := "" -}}
{{- if $verification -}}
{{- $signingUser = $verification.SigningUser -}}
{{- $signingEmail = $verification.SigningEmail -}}
{{- $extraClass = print $extraClass " commit-is-signed" -}}
{{- if $verification.Verified -}}
{{- /* reason is "{name} / {key-id}" */ -}}
{{- $msgReason = $verification.Reason -}}
{{- $verified = true -}}
{{- if eq $verification.TrustStatus "trusted" -}}
{{- $extraClass = print $extraClass " sign-trusted" -}}
{{- else if eq $verification.TrustStatus "untrusted" -}}
{{- $extraClass = print $extraClass " sign-untrusted" -}}
{{- $msgReasonPrefix = ctx.Locale.Tr "repo.commits.signed_by_untrusted_user" -}}
{{- else -}}
{{- $extraClass = print $extraClass " sign-unmatched" -}}
{{- $msgReasonPrefix = ctx.Locale.Tr "repo.commits.signed_by_untrusted_user_unmatched" -}}
{{- end -}}
{{- else -}}
{{- if $verification.Warning -}}
{{- $extraClass = print $extraClass " sign-warning" -}}
{{- else -}}
{{- $extraClass = "" -}}{{/* the commit is not signed */}}
{{- end -}}
{{- $msgReason = ctx.Locale.Tr $verification.Reason -}}{{- /* dirty part: it is the translation key ..... */ -}}
{{- end -}}
{{- if $msgReasonPrefix -}}
{{- $msgReason = print $msgReasonPrefix ": " $msgReason -}}
{{- end -}}
{{- if $verification.SigningSSHKey -}}
{{- $msgSigningKey = print (ctx.Locale.Tr "repo.commits.ssh_key_fingerprint") ": " $verification.SigningSSHKey.Fingerprint -}}
{{- else if $verification.SigningKey -}}{{- /* asymkey.GPGKey */ -}}
{{- $msgSigningKey = print (ctx.Locale.Tr "repo.commits.gpg_key_id") ": " $verification.SigningKey.PaddedKeyID -}}
{{- end -}}
{{- end -}}
{{- if $commit -}}
<a {{if $commitBaseLink}}href="{{$commitBaseLink}}/{{$commit.ID}}"{{end}} class="ui label commit-id-short {{$extraClass}}" rel="nofollow">
{{- ShortSha $commit.ID.String -}}
{{- end -}}
{{- if or (not $commit) $extraClass}}{{/* only show the lock icon if there is no commit info (icon only) or the commit is really signed */}}
<span class="ui label commit-sign-badge {{$extraClass}}">
{{- if $verified -}}
{{- if and $signingUser $signingUser.ID -}}
<span data-tooltip-content="{{$msgReason}}">{{svg "gitea-lock"}}</span>
<span data-tooltip-content="{{$msgSigningKey}}">{{ctx.AvatarUtils.Avatar $signingUser 16}}</span>
{{- else -}}
<span data-tooltip-content="{{$msgReason}}">{{svg "gitea-lock-cog"}}</span>
<span data-tooltip-content="{{$msgSigningKey}}">{{ctx.AvatarUtils.AvatarByEmail $signingEmail "" 16}}</span>
{{- end -}}
{{- else -}}
<span data-tooltip-content="{{$msgReason}}">{{svg "gitea-unlock"}}</span>
{{- end -}}
</span>
{{- end -}}
{{- if $commit -}}
</a>
{{- end -}}
{{- /* This template should be kept as small as possible, DO NOT put large components like modal/dialog into it. */ -}}

View File

@@ -0,0 +1,89 @@
<div class="ui attached table segment commit-table">
<table class="ui very basic striped table unstackable" id="commits-table">
<thead>
<tr>
<th class="three wide">{{ctx.Locale.Tr "repo.commits.author"}}</th>
<th class="two wide sha">{{StringUtils.ToUpper $.Repository.ObjectFormatName}}</th>
<th class="eight wide message">{{ctx.Locale.Tr "repo.commits.message"}}</th>
<th class="two wide tw-text-right">{{ctx.Locale.Tr "repo.commits.date"}}</th>
<th class="one wide"></th>
</tr>
</thead>
<tbody class="commit-list">
{{$commitRepoLink := $.RepoLink}}{{if $.CommitRepoLink}}{{$commitRepoLink = $.CommitRepoLink}}{{end}}
{{range .Commits}}
<tr>
<td class="author">
<div class="tw-flex">
{{$userName := .Author.Name}}
{{if .User}}
{{if and .User.FullName DefaultShowFullName}}
{{$userName = .User.FullName}}
{{end}}
{{ctx.AvatarUtils.Avatar .User 28 "tw-mr-2"}}<a class="muted author-wrapper" href="{{.User.HomeLink}}">{{$userName}}</a>
{{else}}
{{ctx.AvatarUtils.AvatarByEmail .Author.Email .Author.Name 28 "tw-mr-2"}}
<span class="author-wrapper">{{$userName}}</span>
{{end}}
</div>
</td>
<td class="sha">
{{$commitBaseLink := ""}}
{{if $.PageIsWiki}}
{{$commitBaseLink = printf "%s/wiki/commit" $commitRepoLink}}
{{else if $.PageIsPullCommits}}
{{$commitBaseLink = printf "%s/pulls/%d/commits" $commitRepoLink $.Issue.Index}}
{{else if $.Reponame}}
{{$commitBaseLink = printf "%s/commit" $commitRepoLink}}
{{end}}
{{template "repo/commit_sign_badge" dict "Commit" . "CommitBaseLink" $commitBaseLink "CommitSignVerification" .Verification}}
</td>
<td class="message">
<span class="message-wrapper">
{{if $.PageIsWiki}}
<span class="commit-summary {{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{.Summary | ctx.RenderUtils.RenderEmoji}}</span>
{{else}}
{{$commitLink:= printf "%s/commit/%s" $commitRepoLink (PathEscape .ID.String)}}
<span class="commit-summary {{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{ctx.RenderUtils.RenderCommitMessageLinkSubject .Message $commitLink $.Repository}}</span>
{{end}}
</span>
{{if IsMultilineCommitMessage .Message}}
<button class="ui button ellipsis-button" aria-expanded="false" data-global-click="onRepoEllipsisButtonClick">...</button>
{{end}}
{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses}}
{{if IsMultilineCommitMessage .Message}}
<pre class="commit-body tw-hidden">{{ctx.RenderUtils.RenderCommitBody .Message $.Repository}}</pre>
{{end}}
{{if $.CommitsTagsMap}}
{{range (index $.CommitsTagsMap .ID.String)}}
{{- template "repo/tag/name" dict "AdditionalClasses" "tw-py-0" "RepoLink" $.Repository.Link "TagName" .TagName "IsRelease" (not .IsTag) -}}
{{end}}
{{end}}
</td>
{{if .Committer}}
<td class="tw-text-right">{{DateUtils.TimeSince .Committer.When}}</td>
{{else}}
<td class="tw-text-right">{{DateUtils.TimeSince .Author.When}}</td>
{{end}}
<td class="tw-text-right tw-py-0">
<button class="btn interact-bg tw-p-2 copy-commit-id" data-tooltip-content="{{ctx.Locale.Tr "copy_hash"}}" data-clipboard-text="{{.ID}}">{{svg "octicon-copy"}}</button>
{{/* at the moment, wiki doesn't support these "view" links like "view at history point" */}}
{{if not $.PageIsWiki}}
{{/* view single file diff */}}
{{if $.FileTreePath}}
<a class="btn interact-bg tw-p-2 view-single-diff" data-tooltip-content="{{ctx.Locale.Tr "repo.commits.view_file_diff"}}"
href="{{$commitRepoLink}}/commit/{{.ID.String}}?files={{$.FileTreePath}}"
>{{svg "octicon-file-diff"}}</a>
{{end}}
{{/* view at history point */}}
{{$viewCommitLink := printf "%s/src/commit/%s" $commitRepoLink (PathEscape .ID.String)}}
{{if $.FileTreePath}}{{$viewCommitLink = printf "%s/%s" $viewCommitLink (PathEscapeSegments $.FileTreePath)}}{{end}}
<a class="btn interact-bg tw-p-2 view-commit-path" data-tooltip-content="{{ctx.Locale.Tr "repo.commits.view_path"}}" href="{{$viewCommitLink}}">{{svg "octicon-file-code"}}</a>
{{end}}
</td>
</tr>
{{end}}
</tbody>
</table>
</div>

View File

@@ -0,0 +1,112 @@
{{$isTreePathRoot := not .TreeNames}}
<div class="repo-view-content-data tw-hidden" data-document-title="{{ctx.RootData.Title}}" data-document-title-common="{{ctx.RootData.PageTitleCommon}}"></div>
{{template "repo/sub_menu" .}}
<div class="repo-button-row">
<div class="repo-button-row-left">
{{if not $isTreePathRoot}}
<button class="repo-view-file-tree-toggle-show ui compact basic button icon not-mobile {{if .UserSettingCodeViewShowFileTree}}tw-hidden{{end}}"
data-global-click="onRepoViewFileTreeToggle" data-toggle-action="show"
data-tooltip-content="{{ctx.Locale.Tr "repo.diff.show_file_tree"}}">
{{svg "octicon-sidebar-collapse"}}
</button>
{{end}}
{{template "repo/branch_dropdown" dict
"Repository" .Repository
"ShowTabBranches" true
"ShowTabTags" true
"CurrentRefType" .RefFullName.RefType
"CurrentRefShortName" .RefFullName.ShortName
"CurrentTreePath" .TreePath
"RefLinkTemplate" "{RepoLink}/src/{RefType}/{RefShortName}/{TreePath}"
"AllowCreateNewRef" .CanCreateBranch
"ShowViewAllRefsEntry" true
}}
{{if and .CanCompareOrPull .RefFullName.IsBranch (not .Repository.IsArchived)}}
{{$cmpBranch := ""}}
{{if ne .Repository.ID .BaseRepo.ID}}
{{$cmpBranch = printf "%s/%s:" (.Repository.OwnerName|PathEscape) (.Repository.Name|PathEscape)}}
{{end}}
{{$cmpBranch = print $cmpBranch (.BranchName|PathEscapeSegments)}}
{{$compareLink := printf "%s/compare/%s...%s" .BaseRepo.Link (.BaseRepo.DefaultBranch|PathEscapeSegments) $cmpBranch}}
<a id="new-pull-request" role="button" class="ui compact basic button" href="{{QueryBuild $compareLink "expand" 1}}"
data-tooltip-content="{{if .PullRequestCtx.Allowed}}{{ctx.Locale.Tr "repo.pulls.compare_changes"}}{{else}}{{ctx.Locale.Tr "action.compare_branch"}}{{end}}">
{{svg "octicon-git-pull-request"}}
</a>
{{end}}
<!-- Show go to file if on home page -->
{{if $isTreePathRoot}}
<a href="{{.Repository.Link}}/find/{{.RefTypeNameSubURL}}" class="ui compact basic button">{{ctx.Locale.Tr "repo.find_file.go_to_file"}}</a>
{{end}}
{{if and .RefFullName.IsBranch (not .IsViewFile)}}
<button class="ui dropdown basic compact jump button repo-add-file" {{if not .Repository.CanEnableEditor}}disabled{{end}}>
{{ctx.Locale.Tr "repo.editor.add_file"}}
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu">
<a class="item" href="{{.RepoLink}}/_new/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
{{ctx.Locale.Tr "repo.editor.new_file"}}
</a>
{{if .RepositoryUploadEnabled}}
<a class="item" href="{{.RepoLink}}/_upload/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
{{ctx.Locale.Tr "repo.editor.upload_file"}}
</a>
{{end}}
<a class="item" href="{{.RepoLink}}/_diffpatch/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
{{ctx.Locale.Tr "repo.editor.patch"}}
</a>
</div>
</button>
{{end}}
{{if and $isTreePathRoot .Repository.IsTemplate}}
<a role="button" class="ui primary compact button" href="{{AppSubUrl}}/repo/create?template_id={{.Repository.ID}}">
{{ctx.Locale.Tr "repo.use_template"}}
</a>
{{end}}
{{if not $isTreePathRoot}}
{{$treeNameIdxLast := Eval (len .TreeNames) "-" 1}}
<span class="breadcrumb">
<a class="section" href="{{.RepoLink}}/src/{{.RefTypeNameSubURL}}" title="{{.Repository.Name}}">{{StringUtils.EllipsisString .Repository.Name 30}}</a>
{{- range $i, $v := .TreeNames -}}
<span class="breadcrumb-divider">/</span>
{{- if eq $i $treeNameIdxLast -}}
<span class="active section" title="{{$v}}">{{$v}}</span>
<button class="btn interact-fg tw-mx-1" data-clipboard-text="{{$.TreePath}}" data-tooltip-content="{{ctx.Locale.Tr "copy_path"}}">{{svg "octicon-copy" 14}}</button>
{{- else -}}
{{$p := index $.Paths $i}}<span class="section"><a href="{{$.BranchLink}}/{{PathEscapeSegments $p}}" title="{{$v}}">{{$v}}</a></span>
{{- end -}}
{{- end -}}
</span>
{{end}}
</div>
<div class="repo-button-row-right">
<!-- Only show clone panel in repository home page -->
{{if $isTreePathRoot}}
{{template "repo/clone_panel" .}}
{{end}}
{{if and (not $isTreePathRoot) (not .IsViewFile) (not .IsBlame)}}{{/* IsViewDirectory (not home), TODO: split the templates, avoid using "if" tricks */}}
<a class="ui button" href="{{.RepoLink}}/commits/{{.RefTypeNameSubURL}}/{{.TreePath | PathEscapeSegments}}">
{{svg "octicon-history" 16 "tw-mr-2"}}{{ctx.Locale.Tr "repo.file_history"}}
</a>
{{end}}
</div>
</div>
{{if .IsViewFile}}
{{template "repo/view_file" .}}
{{else if .IsBlame}}
{{template "repo/blame" .}}
{{else}}{{/* IsViewDirectory */}}
{{if $isTreePathRoot}}
{{template "repo/code/upstream_diverging_info" .}}
{{end}}
{{template "repo/view_list" .}}
{{if and .ReadmeExist (or .IsMarkup .IsPlainText)}}
{{template "repo/view_file" .}}
{{end}}
{{end}}

View File

@@ -0,0 +1,61 @@
{{/* use grid layout, still use the old ID because there are many other CSS styles depending on this ID */}}
<div id="repo-files-table" {{if .HasFilesWithoutLatestCommit}}hx-indicator="#repo-files-table .repo-file-cell.message" hx-trigger="load" hx-swap="morph" hx-post="{{.LastCommitLoaderURL}}"{{end}}>
<div class="repo-file-line repo-file-last-commit">
{{template "repo/latest_commit" .}}
<div>{{if and .LatestCommit .LatestCommit.Committer}}{{DateUtils.TimeSince .LatestCommit.Committer.When}}{{end}}</div>
</div>
{{$.FileIconPoolHTML}}
{{if .HasParentPath}}
<a class="repo-file-line parent-link silenced" href="{{.BranchLink}}{{if .ParentPath}}{{PathEscapeSegments .ParentPath}}{{end}}">
{{index $.FileIcons ".."}} ..
</a>
{{end}}
{{range $item := .Files}}
<div class="repo-file-item">
{{$entry := $item.Entry}}
{{$commit := $item.Commit}}
{{$submoduleFile := $item.SubmoduleFile}}
<div class="repo-file-cell name muted-links {{if not $commit}}notready{{end}}">
{{index $.FileIcons $entry.Name}}
{{if $entry.IsSubModule}}
{{$submoduleLink := $submoduleFile.SubmoduleWebLinkTree ctx}}
{{if $submoduleLink}}
<a class="entry-name" href="{{$submoduleLink.RepoWebLink}}" title="{{$entry.Name}}">{{$entry.Name}}</a>
@ <a class="text primary" href="{{$submoduleLink.CommitWebLink}}">{{ShortSha $submoduleFile.RefID}}</a>
{{else}}
<span class="entry-name" title="{{$entry.Name}}">{{$entry.Name}}</span>
@ {{ShortSha $submoduleFile.RefID}}
{{end}}
{{else}}
{{if $entry.IsDir}}
{{$subJumpablePathName := $entry.GetSubJumpablePathName}}
<a class="entry-name" href="{{$.TreeLink}}/{{PathEscapeSegments $subJumpablePathName}}" title="{{$subJumpablePathName}}">
{{$subJumpablePathFields := StringUtils.Split $subJumpablePathName "/"}}
{{$subJumpablePathFieldLast := (Eval (len $subJumpablePathFields) "-" 1)}}
{{if eq $subJumpablePathFieldLast 0}}
{{$subJumpablePathName}}
{{else}}
{{$subJumpablePathPrefixes := slice $subJumpablePathFields 0 $subJumpablePathFieldLast}}
<span class="text light-2">{{StringUtils.Join $subJumpablePathPrefixes "/"}}</span>/{{index $subJumpablePathFields $subJumpablePathFieldLast}}
{{end}}
</a>
{{else}}
<a class="entry-name" href="{{$.TreeLink}}/{{PathEscapeSegments $entry.Name}}" title="{{$entry.Name}}">{{$entry.Name}}</a>
{{if $entry.IsLink}}
<a class="entry-symbol-link flex-text-inline" data-tooltip-content title="{{ctx.Locale.Tr "repo.find_file.follow_symlink"}}" href="{{$.TreeLink}}/{{PathEscapeSegments $entry.Name}}?follow_symlink=1">{{svg "octicon-link" 12}}</a>
{{end}}
{{end}}
{{end}}
</div>
<div class="repo-file-cell message loading-icon-2px">
{{if $commit}}
{{$commitLink := printf "%s/commit/%s" $.RepoLink (PathEscape $commit.ID.String)}}
{{ctx.RenderUtils.RenderCommitMessageLinkSubject $commit.Message $commitLink $.Repository}}
{{else}}
{{/* will be loaded again by LastCommitLoaderURL */}}
{{end}}
</div>
<div class="repo-file-cell age">{{if $commit}}{{DateUtils.TimeSince $commit.Committer.When}}{{end}}</div>
</div>
{{end}}
</div>

View File

@@ -0,0 +1,4 @@
[github-theme]
verifed=已验证
partially_verifed=部分验证
unverifed=未验证

View File

@@ -1,22 +1,28 @@
{
"name": "gitea-github-theme",
"version": "1.24.7",
"version": "1.25.3",
"type": "module",
"scripts": {
"dev": "vite build --mode dev",
"build": "tsc -b && vite build",
"build": "tsgo -b && vite build",
"lint": "eslint .",
"format": "prettier --write .",
"commit": "npm run lint && npm run format && npm run build",
"version": "node scripts/version.cjs"
"version": "node scripts/version.cjs",
"tr": "node scripts/translate.cjs",
"tmpl": "node scripts/update_template.cjs",
"release": "npm run build && npm run tr",
"install:clean": "npm cache clean --force && rm -rf node_modules package-lock.json && npm install",
"install:vite8": "npm install --force"
},
"devDependencies": {
"@babel/preset-typescript": "^7.27.1",
"@babel/preset-typescript": "^7.28.4",
"@eslint/js": "^9.29.0",
"@linaria/core": "^6.3.0",
"@types/node": "^24.0.3",
"@vanilla-extract/css": "^1.17.4",
"@vanilla-extract/vite-plugin": "^5.0.6",
"@typescript/native-preview": "^7.0.0-dev.20251203.1",
"@vanilla-extract/css": "^1.17.5",
"@vanilla-extract/vite-plugin": "^5.1.3",
"@wyw-in-js/babel-preset": "^0.7.0",
"@wyw-in-js/vite": "^0.7.0",
"dotenv": "^17.0.0",
@@ -27,11 +33,9 @@
"prettier": "3.5.3",
"prettier-plugin-organize-imports": "^4.1.0",
"sass-embedded": "^1.89.2",
"typescript": "^5.8.3",
"typescript-eslint": "^8.34.1",
"typescript-plugin-css-modules": "^5.1.0",
"typescript-styled-plugin": "^0.18.3",
"vite": "^7.1.9"
"vite": "^8.0.0-beta.0"
},
"prettier": {
"printWidth": 120,

Binary file not shown.

Before

Width:  |  Height:  |  Size: 269 KiB

After

Width:  |  Height:  |  Size: 593 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 295 KiB

After

Width:  |  Height:  |  Size: 602 KiB

54
scripts/translate.cjs Normal file
View File

@@ -0,0 +1,54 @@
const fs = require("fs");
const path = require("path");
const child_process = require("child_process");
const dotenv = require("dotenv");
dotenv.config({ quiet: true });
const rootDir = path.join(__dirname, "..");
const pkgPath = path.join(rootDir, "package.json");
const pkg = JSON.parse(fs.readFileSync(pkgPath));
const githubSite = "https://raw.githubusercontent.com";
const giteaRepo = "go-gitea/gitea";
const githubBranchPath = "refs/heads/release";
const githubTagPath = "refs/tags";
const localePath = "options/locale";
const [major, minor, patch, tag = ""] = pkg.version.split(".");
console.log("Version:", pkg.version);
let versionPath = "";
if (tag.includes("rc") || patch.includes("latest")) {
versionPath = `${githubBranchPath}/v${major}.${minor}`;
} else {
versionPath = `${githubTagPath}/v${major}.${minor}.${patch}`;
}
const githubUrl = `${githubSite}/${giteaRepo}/${versionPath}/${localePath}`;
const locales = fs.readdirSync(path.join(rootDir, localePath)).filter(file => file.endsWith(".ini"));
(async () => {
for (const locale of locales) {
const localUrl = `${githubUrl}/${locale}`;
console.log("LocaleUrl:", localUrl);
const themeLocale = fs.readFileSync(path.join(rootDir, localePath, locale), "utf-8");
const response = await fetch(localUrl);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
let content = await response.text();
if (locale.includes("zh-CN")) {
content = content.replaceAll("工单", "议题").replaceAll("合并请求", "拉取请求");
}
fs.mkdirSync(path.join(rootDir, "dist", localePath), { recursive: true });
fs.writeFileSync(path.join(rootDir, "dist", localePath, locale), content + themeLocale);
}
if (process.env.SSH_SERVER && process.env.GITEA_PATH && process.env.SSH_USER) {
const cmd = `scp -r dist/options ${process.env.SSH_USER}@${process.env.SSH_SERVER}:${process.env.GITEA_PATH}`;
console.log("[translate] exec:", cmd);
child_process.execSync(cmd, { stdio: "inherit" });
}
})();

View File

@@ -0,0 +1,54 @@
const fs = require("fs");
const path = require("path");
const rootDir = path.join(__dirname, "..");
const pkgPath = path.join(rootDir, "package.json");
const pkg = JSON.parse(fs.readFileSync(pkgPath));
const githubSite = "https://raw.githubusercontent.com";
const giteaRepo = "go-gitea/gitea";
const githubTagPath = "refs/tags";
const tmplPath = "templates";
const localTmplPath = path.join(rootDir, "gitea", tmplPath);
const [major, minor, patch = ""] = pkg.version.split(".");
console.log("Version:", pkg.version);
const versionPath = `${githubTagPath}/v${major}.${minor}.${patch}`;
const githubUrl = `${githubSite}/${giteaRepo}/${versionPath}/${tmplPath}`;
// 递归读取所有子目录中的 .tmpl 文件
function readTmplFilesRecursively(dir) {
const results = [];
const files = fs.readdirSync(dir);
for (const file of files) {
const filePath = path.join(dir, file);
const stat = fs.statSync(filePath);
if (stat.isDirectory()) {
// 如果是目录,递归读取
results.push(...readTmplFilesRecursively(filePath));
} else if (file.endsWith(".tmpl")) {
// 如果是 .tmpl 文件,添加到结果中(相对于模板目录的相对路径)
const relativePath = path.relative(localTmplPath, filePath);
results.push(relativePath);
}
}
return results;
}
// 读取所有模板文件
const tmpls = readTmplFilesRecursively(localTmplPath);
(async () => {
for (const tmpl of tmpls) {
const tmplUrl = `${githubUrl}/${tmpl}`;
console.log("TmplUrl:", tmplUrl);
const response = await fetch(tmplUrl);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
let content = await response.text();
fs.writeFileSync(path.join(localTmplPath, tmpl), content);
}
})();

View File

@@ -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 };
@@ -41,10 +42,10 @@ export type GithubColor = {
};
bgColor: {
accent: { emphasis: string; muted: string };
attention: { muted: string };
attention: { emphasis: string; muted: string };
emphasis: string;
success: { emphasis: string; muted: string };
danger: { muted: string };
danger: { emphasis: string; muted: string };
done: { emphasis: string };
default: string;
inset: string;
@@ -131,6 +132,7 @@ export function github2ThemeColor(githubColor: GithubColor): ThemeColor {
};
const other: Other = {
logo: themeVars.color.primary.self,
body: githubColor.bgColor.default,
box: {
header: githubColor.bgColor.muted,
@@ -221,6 +223,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,
@@ -234,6 +240,12 @@ export function github2ThemeColor(githubColor: GithubColor): ThemeColor {
success: {
emphasis: githubColor.bgColor.success.emphasis,
},
attention: {
emphasis: githubColor.bgColor.attention.emphasis,
},
danger: {
emphasis: githubColor.bgColor.danger.emphasis,
},
done: {
emphasis: githubColor.bgColor.done.emphasis,
},

View File

@@ -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";

View File

@@ -121,17 +121,28 @@ export function themePlugin(): Plugin {
const server = process.env.SSH_SERVER;
const user = process.env.SSH_USER || "root";
const theme_path = process.env.GITEA_THEME_PATH;
if (server && theme_path) {
const cmd = `scp dist/${prefix}*.css ${user}@${server}:${theme_path}`;
console.log("[themePlugin] exec:", cmd);
const gitea_path = process.env.GITEA_PATH;
if (server) {
try {
execSync(cmd, { stdio: "inherit" });
// eslint-disable-next-line @typescript-eslint/no-unused-vars
if (theme_path) {
const cmd = `scp dist/${prefix}*.css ${user}@${server}:${theme_path}`;
console.log("[themePlugin] exec:", cmd);
execSync(cmd, { stdio: "inherit" });
} else {
console.log("[themePlugin] no GITEA_THEME_PATH, skip upload");
}
if (gitea_path) {
const cmd = `scp -r templates ${user}@${server}:${gitea_path}`;
console.log("[themePlugin] exec:", cmd);
execSync(cmd, { stdio: "inherit" });
} else {
console.log("[themePlugin] no GITEA_TMPL_PATH, skip upload");
}
} catch (_) {
// continue regardless of error
}
} else {
console.log("[themePlugin] no SSH_SERVER or GITEA_THEME_PATH, skip upload");
console.log("[themePlugin] no SSH_SERVER, skip upload");
}
console.log("[themePlugin] exec end.");
},

View File

@@ -1,4 +1,10 @@
export const github = {
avatar: {
/** 头像的背景颜色 */
bgColor: null,
/** 头像的边框颜色 */
borderColor: null,
},
/** 用于 color 属性的颜色 */
fgColor: {
/** 强调色
@@ -47,9 +53,22 @@ export const github = {
*/
emphasis: null,
},
attention: {
/** 注意的背景颜色
* @issue `prMerge` 头像颜色
*/
emphasis: null,
},
danger: {
/** 危险的背景颜色
* @issue `prMerge` 头像颜色
*/
emphasis: null,
},
done: {
/** 完成的背景颜色
* @issue `babel` 工单已关闭图标背景颜色
* @issue `prMerge` 头像颜色
*/
emphasis: null,
},
@@ -188,6 +207,7 @@ export const github = {
* @issue `issueList` 头部菜单左侧开启关闭菜单的悬停背景颜色
* @dashboard `dashboard` 仓库列表项目的悬停背景颜色
* @notification `notification` 通知列表的按钮悬停背景颜色
* @actions `actions` 列表页运行信息的三点操作按钮悬停背景颜色
*/
hover: null,
},

View File

@@ -8,6 +8,8 @@ export const otherAuto = {
};
export const other = {
/** 未登录时的介绍首页的 SVG 和链接文字颜色 */
logo: null,
/** 主要背景色 */
body: null,
/** 页面底部状态栏背景色 */

View File

@@ -36,7 +36,7 @@ export const actions = css`
border-top-right-radius: ${otherThemeVars.border.radius};
padding: 16px;
margin-bottom: 0;
> .item {
> .ui.dropdown {
color: ${themeVars.color.text.light.num1};
}
}
@@ -63,6 +63,7 @@ export const actions = css`
color: ${themeVars.github.fgColor.accent};
font-family: var(--fonts-monospace);
font-weight: 400;
padding: 0px 6px;
&:hover {
background-color: ${themeVars.github.bgColor.accent.muted};
color: ${themeVars.github.fgColor.accent};
@@ -76,22 +77,27 @@ export const actions = css`
.flex-item {
padding: 16px;
line-height: 18px;
.flex-item-leading {
align-self: flex-start;
margin-top: 2px;
}
.flex-item-main {
gap: 0.5rem;
}
.flex-item-trailing {
justify-content: space-between;
> .ui.label {
border-radius: ${otherThemeVars.border.radius};
margin-left: 32px;
}
> .ui.dropdown.jump {
border-radius: ${otherThemeVars.border.radius};
color: ${themeVars.color.text.light.num1};
&:hover {
background-color: ${themeVars.github.control.transparent.bgColor.hover};
}
.menu > .item:hover {
color: ${themeVars.color.text.self} !important;
}
}
}
}
@@ -133,13 +139,21 @@ export const runWorkflow = css`
export const actionViewHeader = css`
.action-view-header {
.action-commit-summary {
a:hover {
text-decoration: inherit;
}
// 提前哈希
> a.muted:first-of-type {
text-decoration: underline;
}
// 分支标签按钮
.ui.label {
.ui.ui.ui.label {
background-color: ${themeVars.github.bgColor.accent.muted};
border-radius: ${otherThemeVars.border.radius};
color: ${themeVars.github.fgColor.accent};
font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace);
font-weight: 400;
> a {
font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
font-weight: 400;
opacity: 1;
}
}
@@ -149,10 +163,10 @@ export const actionViewHeader = css`
// 工作流左侧作业列表
export const actionViewLeft = css`
.action-view-left {
.action-view-left.action-view-left.action-view-left {
margin-right: 28px;
border-top: 1px solid ${themeVars.color.console.border};
max-width: 22vw;
&:before {
content: "Jobs";
color: ${themeVars.color.console.fg.subtle};
@@ -164,52 +178,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;
}
}
}
}
@@ -223,67 +238,83 @@ export const actionViewRight = css`
.action-view-right {
/* 提前加载高度和滚动条 */
min-height: calc(100vh - 245px);
// 作业详情页标题
.job-info-header {
padding: 16px 12px 16px 24px;
height: 80px;
.job-info-header-title {
color: ${themeVars.github.fgColor.accent};
padding: 16px 12px 16px 24px !important;
height: 80px !important;
.job-info-header-left {
.job-info-header-title {
color: ${themeVars.github.fgColor.accent} !important;
}
.job-info-header-detail {
margin-top: 8px;
}
}
.job-info-header-detail {
margin-top: 8px;
.job-info-header-right {
.ui.dropdown {
> .button {
border: unset;
padding: 7px !important;
}
.menu > .item > i.icon {
margin-right: 2px;
}
}
}
}
.job-step-container {
// 步骤标题
.job-step-summary {
color: ${themeVars.color.console.fg.subtle};
padding: 8px 10px;
&.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;
}
}
}
}

View File

@@ -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,19 +29,15 @@ export const commit = css`
.message {
// tag 标签
a.ui.basic.primary.label {
border-radius: 25px;
border-radius: 9999px;
border-width: 1.5px;
padding: 5px 8px !important;
padding: 3px 8px !important;
}
}
// 提交信息右侧
.tw-text-right {
// 时间标签
relative-time,
// 复制 SHA 按钮
.btn.copy-commit-id,
// 查看提交路径按钮
.btn.view-commit-path {
svg {
color: ${themeVars.color.text.light.num1};
}
}
@@ -67,11 +66,36 @@ export const commit = css`
export const commitStatus = css`
.flex-text-inline[data-global-init="initCommitStatuses"] {
padding: 6px;
padding: 3px;
margin-top: 2px;
border-radius: ${otherThemeVars.border.radius};
&:hover {
background-color: ${themeVars.github.control.transparent.bgColor.hover};
}
svg {
width: 16px;
height: 16px;
min-width: 16px;
min-height: 16px;
}
}
`;
// 提交图
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;
// 验证提交 SHA 标签
&.commit-is-signed {
span.ui.label.commit-is-signed {
height: 25px;
}
}
}
}
`;

View File

@@ -1,4 +1,5 @@
import { css, otherThemeVars, themeVars } from "src/types/vars";
import { labelStyle } from "styles/public/label";
export const dashboard = css`
// 首页仪表板, 避免选中管理员后台的维护管理面板
@@ -38,6 +39,9 @@ export const dashboard = css`
font-weight: 400;
background-color: unset !important;
margin-bottom: 0.25rem;
.ui.label {
border-color: #00000000;
}
}
// 仓库/组织列表
.ui.attached.segment {
@@ -47,6 +51,13 @@ export const dashboard = css`
&.repos-search {
border-top-left-radius: 12px;
border-top-right-radius: 12px;
> .menu.repos-filter {
.ui.circular.label {
border-color: #00000000;
min-height: fit-content;
padding: ${labelStyle.padding} !important;
}
}
}
&.table {
&:last-child {
@@ -58,6 +69,7 @@ export const dashboard = css`
li {
border-radius: ${otherThemeVars.border.radius};
padding: 6px 8px !important;
height: 32px;
&:not(:last-child) {
border-bottom: 0;
}

View File

@@ -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;
}
}
`;

View File

@@ -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 {
@@ -99,11 +101,13 @@ export const repoFiles = css`
background: ${themeVars.color.body};
min-height: 48px;
padding: 0px 8px !important;
overflow-x: visible;
svg {
color: ${themeVars.color.text.light.num1};
}
.file-header-left {
padding: 8px !important;
padding: 6px 8px !important;
line-height: 1.45;
// 伪元素宽度等于按钮宽度而不是父元素宽度
position: relative;
&:hover {
@@ -114,7 +118,7 @@ export const repoFiles = css`
content: "";
background: ${themeVars.github.underlineNav.borderColor.active};
border-radius: ${otherThemeVars.border.radius};
bottom: -7px;
bottom: -8px;
left: 0;
height: 2px;
position: absolute;
@@ -125,9 +129,19 @@ export const repoFiles = css`
text-decoration-line: none;
}
}
.file-header-right:hover {
background: ${themeVars.github.control.transparent.bgColor.hover};
border-radius: ${otherThemeVars.border.radius};
.file-header-right {
.btn-octicon {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0px 8px;
border-radius: ${otherThemeVars.border.radius};
height: 28px;
width: 28px;
&:hover {
background: ${themeVars.github.control.transparent.bgColor.hover};
}
}
}
}
}
@@ -181,17 +195,18 @@ export const repoFileView = css`
top: 0;
// 左侧文件树
.repo-view-file-tree-container {
height: calc(100vh - 64px); // 减去头部高度
height: 100vh;
// 固定头部
position: sticky;
top: 0;
overflow-y: unset;
&:after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 1px;
height: calc(100% + 64px); // 头部高度
height: 100%;
background: ${themeVars.color.secondary.self};
}
> .repo-button-row {
@@ -282,6 +297,7 @@ export const repoFileView = css`
font-size: 12px;
}
.file-header-right {
gap: 0px;
// 按钮组
> .ui.buttons {
margin: 0 8px 0 0 !important; // 完全不知道为什么浏览器最终效果没生效, 只能 !important 了
@@ -298,18 +314,24 @@ export const repoFileView = css`
align-items: center;
background: ${themeVars.color.button};
border: 1px solid ${themeVars.color.light.border};
border-left-width: 0;
height: 28px;
padding: 0 8px;
svg {
color: ${themeVars.color.text.light.num1};
}
&:first-of-type {
border-left-width: 1px;
border-top-left-radius: ${otherThemeVars.border.radius};
border-bottom-left-radius: ${otherThemeVars.border.radius};
}
&: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};
@@ -329,6 +351,11 @@ export const repoFileView = css`
.commit-summary {
color: ${themeVars.color.text.light.num1};
}
> img.ui.avatar {
border-radius: 9999px;
width: 20px;
height: 20px;
}
}
// 右侧提交时间
> .age {
@@ -384,18 +411,19 @@ export const repoSidebarTop = css`
padding: 10px 0 0 0;
// 仓库描述本身
.flex-item-title {
margin-top: 12px;
margin-top: 10px;
}
// 仓库描述内容
.flex-item-body {
> .tw-flex:first-child {
margin-top: 21px !important;
margin-top: 16px !important;
gap: 8px !important;
}
.repo-description {
color: ${themeVars.color.text.self};
}
#repo-topics {
margin: 10px 0px !important;
margin: 8px 0px !important;
}
.flex-text-block {
font-size: 14px;
@@ -430,10 +458,9 @@ 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;
}
}
.flex-item-header .flex-item-title {

View File

@@ -69,27 +69,80 @@ export const heatmap = css`
// 动态
export const activity = css`
.activity-heatmap-container + .divider:not(.divider-text) {
border-color: #0000;
}
.flex-list#activity-feed {
border-radius: 12px;
box-shadow: ${themeVars.github.shadow.floating.small};
> .flex-item {
gap: 12px;
padding: 12px 8px 16px 14px;
padding: 16px;
> .flex-item-leading {
img {
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;
}
}
relative-time {
// 动态的描述
> .tw-flex-col {
gap: 0px !important;
> .flex-text-block {
gap: 4px;
font-size: 12px;
color: ${themeVars.color.text.light.num1};
img {
width: 16px;
height: 16px;
border-radius: 9999px;
}
.ui.sha.label {
margin-top: 0;
}
}
}
> .flex-item-body {
gap: 4px;
font-size: 12px;
color: ${themeVars.color.text.light.num1};
}
> a {
font-size: 12px;
}
}
// 动态的右侧 svg 图标
.flex-item-trailing svg {
height: 20px;
width: 20px;
.flex-item-trailing {
align-self: center;
svg {
height: 18px;
width: 18px;
}
}
}
> .page.buttons {

View File

@@ -56,6 +56,9 @@ export const issueList = css`
height: 32px;
}
}
img.ui.avatar {
border-radius: 9999px;
}
}
}
// 里程碑详细页面的 Issue 列表
@@ -70,9 +73,13 @@ 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;
min-height: 64px;
&:last-child {
border-bottom-left-radius: ${otherThemeVars.border.radius};
border-bottom-right-radius: ${otherThemeVars.border.radius};
@@ -80,18 +87,16 @@ export const issueList = css`
&:hover {
background-color: ${themeVars.color.hover.opaque};
}
> .flex-item-icon {
display: flex;
gap: 4px;
> .flex-item-leading {
align-self: flex-start;
margin-top: 14px;
margin-left: 16px;
// 复选框
input {
background: unset;
margin-top: 14px;
margin-right: 8px !important;
}
svg {
margin-top: 14px;
> .flex-text-inline {
margin-top: 0px !important;
// 复选框
input {
margin-right: 8px !important;
}
}
}
> .flex-item-main {
@@ -177,6 +182,9 @@ export const issuePins = css`
display: none;
}
}
img.ui.avatar {
border-radius: 9999px;
}
}
`;
@@ -255,7 +263,7 @@ export const prBranch = css`
font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace);
font-size: 12px;
padding: 0 5px;
line-height: 20px;
line-height: 18px;
}
.repository.view.issue .pull-desc code {
@@ -267,9 +275,17 @@ export const prBranch = css`
}
`;
const botLabelStyle = {
height: "20px",
padding: "0 6px!important",
marginLeft: "4px",
};
// 评论
export const comment = css`
.comment .comment-container {
img.ui.avatar {
border-radius: 9999px;
}
// 去除评论标题左侧指向头像的小箭头
.comment-header,
&:target .comment-header {
@@ -288,6 +304,26 @@ export const comment = css`
.comment-header {
padding: 4px 4px 4px 16px;
min-height: 38px;
.comment-header-left {
// bot 标签
.ui.basic.label {
${botLabelStyle}
}
a:has(relative-time){
text-decoration: underline;
}
// 已编辑按钮
.content-history-menu {
color: ${themeVars.color.text.light.num1} !important;
.menu .item {
font-size: 12px;
.ui.avatar {
height: 20px;
width: 20px;
}
}
}
}
}
.comment-header-right {
> .item,
@@ -300,16 +336,19 @@ export const comment = css`
height: 20px;
padding: 0 6px;
}
// 隐藏顶部菜单的表情按钮
// 无法使用此样式, 评论无表情时底部的表情按钮元素不会渲染, 这是一个先有鸡还是先有蛋的问题
// 很蛋疼, 希望 Gitea 早日使用 Github 的样式, 因为 Github 的更合理, 无论是操作的方便程度还是按钮的冗余度
// .ui.dropdown.action.select-reaction {
// 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 {
@@ -327,7 +366,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;
@@ -338,7 +377,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,8 +431,7 @@ export const prMerge = css`
.repository.view.issue .comment-list .timeline-item.pull-merge-box {
// 头像
.timeline-avatar {
color: ${themeVars.color.white} !important;
border-radius: ${otherThemeVars.border.radius};
border-radius: 9999px;
width: 40px;
height: 40px;
display: flex;
@@ -403,32 +441,67 @@ export const prMerge = css`
width: 24px;
height: 24px;
}
// 可以合并
&.green {
background-color: ${themeVars.github.bgColor.success.emphasis};
// 操作评论边框色
// PR 界面的 PR 操作评论
&.text {
color: ${themeVars.color.white} !important;
border-radius: ${otherThemeVars.border.radius};
// 操作评论边框
+ .content > .ui.attached.segment {
border-left-color: ${themeVars.github.bgColor.success.emphasis};
border-right-color: ${themeVars.github.bgColor.success.emphasis};
&:first-child {
border-top-color: ${themeVars.github.bgColor.success.emphasis};
}
&:last-child {
border-bottom-color: ${themeVars.github.bgColor.success.emphasis};
border-width: 1.5px;
}
&.grey {
background-color: ${themeVars.color.text.light.num1};
}
&.green {
background-color: ${themeVars.github.bgColor.success.emphasis};
+ .content > .ui.attached.segment {
border-left-color: ${themeVars.github.bgColor.success.emphasis};
border-right-color: ${themeVars.github.bgColor.success.emphasis};
&:first-child {
border-top-color: ${themeVars.github.bgColor.success.emphasis};
}
&:last-child {
border-bottom-color: ${themeVars.github.bgColor.success.emphasis};
}
}
}
}
// 已合并
&.purple {
background-color: ${themeVars.github.bgColor.done.emphasis};
+ .content > .ui.attached.segment {
border-left-color: ${themeVars.github.bgColor.done.emphasis};
border-right-color: ${themeVars.github.bgColor.done.emphasis};
&:first-child {
border-top-color: ${themeVars.github.bgColor.done.emphasis};
&.purple {
background-color: ${themeVars.github.bgColor.done.emphasis};
+ .content > .ui.attached.segment {
border-left-color: ${themeVars.github.bgColor.done.emphasis};
border-right-color: ${themeVars.github.bgColor.done.emphasis};
&:first-child {
border-top-color: ${themeVars.github.bgColor.done.emphasis};
}
&:last-child {
border-bottom-color: ${themeVars.github.bgColor.done.emphasis};
}
}
&:last-child {
border-bottom-color: ${themeVars.github.bgColor.done.emphasis};
}
&.yellow {
background-color: ${themeVars.github.bgColor.attention.emphasis};
+ .content > .ui.attached.segment {
border-left-color: ${themeVars.github.bgColor.attention.emphasis};
border-right-color: ${themeVars.github.bgColor.attention.emphasis};
&:first-child {
border-top-color: ${themeVars.github.bgColor.attention.emphasis};
}
&:last-child {
border-bottom-color: ${themeVars.github.bgColor.attention.emphasis};
}
}
}
&.red {
background-color: ${themeVars.github.bgColor.danger.emphasis};
+ .content > .ui.attached.segment {
border-left-color: ${themeVars.github.bgColor.danger.emphasis};
border-right-color: ${themeVars.github.bgColor.danger.emphasis};
&:first-child {
border-top-color: ${themeVars.github.bgColor.danger.emphasis};
}
&:last-child {
border-bottom-color: ${themeVars.github.bgColor.danger.emphasis};
}
}
}
}
@@ -472,11 +545,9 @@ export const prMerge = css`
padding: 16px;
display: grid;
gap: 8px;
&.no-header {
&::before,
&::after {
display: none;
}
&::before,
&::after {
display: none;
}
}
}
@@ -493,15 +564,28 @@ export const timeline = css`
}
.timeline-item,
.timeline-item-group {
padding: 16px 0;
padding: 12px 0;
.comment-text-line {
color: ${themeVars.color.text.light.num1};
}
// 事件
&.event {
// 修复覆盖后的位置问题
padding-left: 15px;
.avatar {
// 避免锚中批准的头像
.avatar-with-link .avatar {
width: 20px;
height: 20px;
}
// 批准时间的头像
// 头部居中偏移量(头像高度 - 标准行信息高度) / 2: (40px - 32px) / 2 = 4px
.timeline-avatar {
top: -4px;
}
// bot 标签
.comment-text-line .ui.basic.label {
${botLabelStyle}
}
.badge {
border: 2px solid ${themeVars.color.body};
}
@@ -546,6 +630,9 @@ export const issueSidebar = css`
// 工单&创建工单&PR页面侧边栏
.page-content.repository.issue {
.issue-content {
img.ui.avatar {
border-radius: 9999px;
}
gap: 24px;
// 侧边栏
.issue-content-right {
@@ -564,6 +651,8 @@ export const issueSidebar = css`
color: ${themeVars.color.text.light.num1};
font-size: 12px;
}
// WIP 前缀提示
> a,
.ui.dropdown.select-branch,
.ui.form,
a.fixed-text.muted,
@@ -597,6 +686,18 @@ export const issueSidebar = css`
margin-top: 0 !important;
margin-bottom: 0 !important;
}
// 评审人
.ui.relaxed.list {
.item {
// 操作图标按钮
a.muted.icon {
color: ${themeVars.color.text.light.num1};
&:hover {
color: ${themeVars.color.primary.self};
}
}
}
}
// 标签菜单项
.ui.dropdown > .menu > .scrolling.menu > .item:has(.item-secondary-info) {
// 修复标签菜单中描述文本过长没有换行挤掉标签的问题
@@ -642,13 +743,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};
}
}
}
}
}
// 选中日期颜色
@@ -663,7 +773,8 @@ export const issueSidebar = css`
// 订阅按钮
.ui.watching .ui.button {
padding: 0px 8px;
height: 28px;
height: 30px;
min-height: 30px;
svg {
margin: 0 !important;
}
@@ -671,7 +782,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;
@@ -700,3 +811,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};
}
}
}
}
`;

View File

@@ -4,8 +4,12 @@ import { css, customThemeVars, otherThemeVars, themeVars } from "src/types/vars"
export const navbarRight = css`
#navbar {
border-bottom: 0;
padding: 0px 16px;
padding: 8px 16px; // 上下内边距 + .navbar-left & .navbar-right 的 min-height = 64px
min-height: 64px;
.navbar-left,
.navbar-right {
min-height: 48px;
}
.navbar-left {
gap: 8px;
> .item {
@@ -32,15 +36,12 @@ export const navbarRight = css`
gap: 8px;
// 右侧按钮, 但不包括头像
> .item:not(:last-child) {
display: grid;
gap: 4px;
grid-auto-columns: max-content;
align-items: center;
align-content: center;
justify-content: center;
gap: 4px;
border: 1px solid ${themeVars.color.light.border};
border-radius: ${otherThemeVars.border.radius};
padding: unset;
padding: 0;
height: 32px;
min-width: 32px;
min-height: 32px;
@@ -75,8 +76,7 @@ export const navbarRight = css`
.item.ui.dropdown {
// 头像菜单
&:last-child {
padding-left: 2px; // 调整此选项需同步增减相同的标识的 left
padding-right: 16px;
padding: 0;
.text {
// 不显示小箭头标识
> .not-mobile {
@@ -84,23 +84,15 @@ export const navbarRight = css`
}
// 头像
img {
border-radius: 25px;
border-radius: 9999px;
height: 32px;
max-height: 32px;
margin: 0 !important;
}
}
}
// 用户头像的管理员标识
.navbar-profile-admin {
background-color: ${themeVars.github.bgColor.accent.emphasis};
border-radius: 25px;
border: 2px solid ${themeVars.color.nav.bg};
color: ${themeVars.color.white};
font-size: 9px;
font-weight: 600;
padding: 2px 5px;
top: -7px;
left: 21px;
&.active {
background: unset;
}
}
}
// 通知和计时器的圆点
@@ -108,7 +100,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;
@@ -136,13 +128,33 @@ export const navbarRight = css`
}
}
}
// 手机下的创建菜单按钮
// 手机下的导航栏
@media (max-width: 767.98px) {
#navbar .navbar-right:has(.user-menu) > .item:not(:last-child) {
display: none;
}
#navbar.navbar-menu-open .navbar-right:has(.user-menu) > .item:not(:last-child) {
display: grid;
#navbar {
&.navbar-menu-open {
gap: 8px;
}
.navbar-mobile-right {
gap: 8px;
> .item {
align-items: center;
justify-content: center;
border: 1px solid ${themeVars.color.light.border};
border-radius: ${otherThemeVars.border.radius};
padding: 0;
height: 32px;
min-width: 32px;
min-height: 32px;
// 纠正内容保证居中
.tw-relative {
height: 16px;
width: 16px;
}
.svg {
margin: 0;
}
}
}
}
}
`;

View File

@@ -90,7 +90,7 @@ export const notification = css`
}
// 通知列表
&:has(#notification_table) {
> .tw-flex:first-child {
> .flex-text-block:first-child {
background-color: ${themeVars.color.box.header};
border: 1px solid ${themeVars.color.light.border};
border-bottom: 0;
@@ -137,7 +137,7 @@ export const notification = css`
color: ${themeVars.color.text.light.num1};
> .notifications-item {
border-top: 1px solid ${themeVars.color.light.border};
padding: 8px !important;
padding: 12px !important;
&:first-child {
border-top: 0;
}
@@ -153,11 +153,11 @@ export const notification = css`
box-shadow: 2px 0 0 ${themeVars.github.borderColor.accent.emphasis} inset;
color: ${themeVars.color.text.self};
}
> .notifications-link {
> .notifications-top-row {
> .notifications-link > div {
&:first-child {
font-size: 12px !important;
}
> .notifications-bottom-row {
&:last-child {
font-size: 14px !important;
}
}

View File

@@ -2,8 +2,24 @@ import { css, themeVars } from "src/types/vars";
export const org = css`
.page-content.organization {
// 组织成员头像
.members .ui.avatar {
border-radius: 9999px;
}
// 组织头像
.org-avatar {
margin: 8px 24px 16px 0px;
}
// 组织信息
#org-info {
.ui.header {
margin-top: 8px; // 与头像对齐
gap: 8px;
// 组织名称
> .ui.header {
font-size: 24px;
> .org-visibility {
margin-left: 8px;
}
// 组织页面的 RSS 订阅按钮
.ui.label.button {
padding: 4px 16px;
@@ -16,6 +32,17 @@ export const org = css`
}
}
}
// 组织描述
> .markup {
color: ${themeVars.color.text.light.num1};
}
// 组织信息
> .meta {
font-size: 12px;
svg {
color: ${themeVars.color.text.light.num1};
}
}
}
}
`;

View File

@@ -35,7 +35,6 @@ export const packagesList = css`
font-size: 12px;
a {
text-decoration: underline;
text-underline-offset: 3px;
}
}
}
@@ -51,8 +50,9 @@ export const packagesDetail = css`
.issue-title-header > div {
color: ${themeVars.color.text.light.num1};
}
.issue-content {
.issue-content-left {
.packages-content {
.packages-content-left {
width: calc(100% - 304px - 16px);
.ui.top.attached.header {
font-size: 14px;
padding: 16px;
@@ -80,9 +80,10 @@ export const packagesDetail = css`
}
}
}
.issue-content-right {
.packages-content-right {
border: 0;
padding: 0px 16px;
width: 304px;
> strong {
font-size: 16px;
}
@@ -102,7 +103,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;

View File

@@ -48,10 +48,14 @@ export const tags = css`
.tag-list-row-title {
line-height: 1.5;
}
.download {
.muted-links {
color: ${themeVars.color.text.light.num1};
font-size: 12px;
a.muted:hover {
svg {
min-width: 12px;
width: 12px;
}
a:hover {
text-decoration: none;
}
}
@@ -101,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 {
@@ -133,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 {

View File

@@ -17,10 +17,10 @@ export const repoHeader = css`
display: flex;
align-items: center;
color: ${themeVars.color.text.self};
font-size: 16px;
font-size: 18px;
text-decoration: none !important;
min-width: 3ch;
padding: 4px 6px;
padding: 0px 6px;
border-radius: ${otherThemeVars.border.radius};
margin-top: 0.5rem;
margin-bottom: 0.5rem;
@@ -71,10 +71,11 @@ 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: 5px 10px;
padding: 0px 10px;
line-height: 22px;
background-color: ${themeVars.github.bgColor.accent.muted};
color: ${themeVars.github.fgColor.accent};
&:hover {

View File

@@ -83,3 +83,12 @@ export const label = css`
}
}
`;
// 修复组织设置界面的组织设置中多余的边框
export const fixOrgSetting = css`
.page-content.organization.settings {
.org-setting-content {
border: 0;
}
}
`;

View File

@@ -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;
}
}
}
}
`;

View File

@@ -6,3 +6,5 @@
import "./public";
// 组件样式
import "./components";
// 模板专属样式
import "./templates";

View File

@@ -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% {

View File

@@ -7,6 +7,7 @@ export const attached = css`
.user-setting-content,
.org-setting-content,
.admin-setting-content,
// 仓库动态页面
// 新建页面内容
.page-content.repository.new-repo,
.page-content.repository.new.migrate,
@@ -18,19 +19,45 @@ export const attached = css`
font-weight: 400;
background-color: unset !important;
margin-bottom: 0.25rem;
padding-left: 0;
padding-right: 0;
> .ui.right {
right: 0;
}
}
.ui.attached.segment {
background-color: unset;
border-radius: ${otherThemeVars.border.radius} !important;
}
.ui.attached.segment:not(.error) {
border-top-left-radius: ${otherThemeVars.border.radius} !important;
border-top-right-radius: ${otherThemeVars.border.radius} !important;
border-bottom-left-radius: 0 !important;
border-bottom-right-radius: 0 !important;
border: 1px solid ${themeVars.color.light.border} !important;
+ .ui.attached.segment {
border-top: 0 !important;
border-top-left-radius: 0 !important;
border-top-right-radius: 0 !important;
}
&:has(+ :not(.ui.attached.segment)),
&:last-child {
border-bottom-left-radius: ${otherThemeVars.border.radius} !important;
border-bottom-right-radius: ${otherThemeVars.border.radius} !important;
}
}
.ui.attached.segment.error {
border: 1px solid ${themeVars.color.error.border} !important;
}
}
`;
// 仓库活动页面下的边框线修复
export const fixActivity = css`
.page-content.repository.commits .flex-container-main:has(.ui.header.activity-header) {
> .ui.attached.segment {
border-radius: 0;
&:has(+ :not(.ui.attached.segment)) {
border-bottom-left-radius: ${otherThemeVars.border.radius};
border-bottom-right-radius: ${otherThemeVars.border.radius};
}
}
}
`;

14
styles/public/base.ts Normal file
View File

@@ -0,0 +1,14 @@
import { css } from "src/types/vars";
export const body = css`
body {
line-height: 1.5;
}
a {
text-underline-offset: 0.2rem; // 0.2rem 可以始终保持下划线不受 overflow: hidden 的影响
}
// 默认代码块
code:not(.code-inner) {
padding: 0.2em 0.4em;
}
`;

View File

@@ -111,6 +111,7 @@ export const fixButtonHeight = css`
// 修复仓库页仓库操作按钮高度对齐和修正
.repo-button-row .ui.button {
min-height: 32px;
height: 32px;
}
// 修复因上面小按钮高度导致仓库星标克隆等按钮高度过高
.repo-header {
@@ -118,6 +119,7 @@ export const fixButtonHeight = css`
.ui.labeled.button > .label {
height: 28px;
min-height: 28px;
line-height: 1.5;
}
}
.ui.ui.ui.ui.small.button.compact .ui.tiny.buttons .button,

View File

@@ -57,7 +57,7 @@ export const dropdown = css`
}
svg {
margin-top: 2px;
margin-right: 4px;
margin-right: 2px;
}
// 复选框对齐
.ui.checkbox input[type="checkbox"] {
@@ -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;

View File

@@ -1,9 +1,11 @@
// organize-imports-ignore
// tslint:disable:ordered-imports
// 组件导入有顺序, 禁止插件优化
import "./base"; // 基础样式, 确保在其他样式之前导入
import "./radius"; // 圆角, 此样式为基础样式, 确保在其他样式之前导入
import "./animation"; // 动画效果
import "./transition"; // 过渡效果
import "./table"; // 表格
import "./text"; // 文本或 SVG 的基本颜色
import "./button"; // 按钮
import "./dropdown"; // 下拉框

View File

@@ -40,7 +40,7 @@ export const input = css`
align-items: center;
}
// 下拉菜单的输入框
.ui.dropdown.dropdown .menu>.input {
.ui.dropdown.dropdown .menu > .input {
margin: 12px 10px;
}
`;

View File

@@ -1,69 +1,86 @@
import { css, themeVars } from "src/types/vars";
export const labelStyle = {
padding: "0px 6px",
};
export const label = css`
.ui.label {
border: 1px solid #00000000;
}
/* 所有标签, 但不包括 a 标签 */
/* a 标签比如仓库点星等按钮旁边的数字标签按钮,提交图中的 tag 标签 */
div.label,
span.label,
// 包含多个标签的元素, 比如 Issue/PR 详情页中的时间线上的标签
span.labels-list a.label {
&.ui.ui.ui {
border-radius: 9999px;
${labelStyle}
line-height: 18px;
&.mini {
line-height: 16px;
}
// 多个标签的组合标签的圆角修复
&.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;
// 多个标签的组合标签的圆角修复
&.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};
}
}
}
@@ -97,14 +114,23 @@ export const shaLabel = css`
background-color: ${themeVars.color.label.hoverBg} !important;
}
span.ui.label.commit-is-signed {
padding: 3px 5px;
margin-left: 5px;
height: 25px;
}
img.ui.avatar {
border-radius: 9999px;
}
}
}
// 修复带验证的提交 SHA 标签的高度
.ui.label.commit-id-short {
height: 25px;
}
// 验证提交附带的图标
span.ui.label.commit-is-signed {
height: 25px;
min-width: 35px;
justify-content: center;
// 验证信任
&.sign-trusted {
border: 1.5px solid ${themeVars.color.green.badge.self} !important;
@@ -137,6 +163,19 @@ export const shaLabel = css`
background-color: ${themeVars.color.red.badge.hover.bg} !important;
}
}
span {
display: inline-flex;
align-items: center;
justify-content: center;
}
}
span.ui.label.commit-is-signed,
.ui.label.commit-id-short,
.ui.label.commit-sign-badge {
font-size: 12px;
.ui.avatar {
border-radius: 9999px;
}
}
`;
@@ -181,10 +220,6 @@ export const repoLabel = css`
color: ${themeVars.color.text.light.num1};
font-size: 12px;
font-weight: 500;
padding: 3px 6px;
}
}
.org-visibility span.ui.basic.label {
font-size: 14px;
}
`;

View File

@@ -1,10 +1,11 @@
import { css, otherThemeVars, themeVars } from "src/types/vars";
import { labelStyle } from "./label";
export const activeItemAfterStyle = {
backgroundColor: themeVars.github.borderColor.accent.emphasis,
borderRadius: otherThemeVars.border.radius,
height: "24px",
left: "calc(0.5rem * -1)",
left: "-8px",
position: "absolute",
top: "calc(50% - 12px)",
width: "4px",
@@ -139,6 +140,10 @@ export const menu = css`
}
}
}
// 菜单标签样式
.ui.menu .item > .label:not(.floating) {
${labelStyle}
}
`;
export const secondaryMenu = css`

View File

@@ -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};
}
`;

8
styles/public/table.ts Normal file
View File

@@ -0,0 +1,8 @@
import { css, themeVars } from "src/types/vars";
export const table = css`
.ui.table > tr > td,
.ui.table > tbody > tr > td {
border-top: 1px solid ${themeVars.color.secondary.alpha.num70};
}
`;

View File

@@ -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;

View File

@@ -0,0 +1 @@
import "./repo";

View File

@@ -0,0 +1,41 @@
import { css, otherThemeVars, themeVars } from "src/types/vars";
export const commitSignBadge = css`
a.ui.label.commit-id-short.github-theme-commit-sha {
gap: 8px;
padding: unset;
margin: unset;
height: 26px;
margin: 0 4px;
&.commit-is-signed {
&:hover {
background-color: unset !important;
}
span.ui.label.commit-sign-badge.commit-is-signed {
margin: unset;
}
}
.github-theme-sha {
border-radius: ${otherThemeVars.border.radius};
font-family:
-apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji";
font-weight: 500;
padding: 0px 8px;
height: 26px;
min-width: 85px; // 非等宽字体导致不对齐, 目前看到最大长度为 83px
display: flex;
align-items: center;
justify-content: center;
&:hover {
background-color: ${themeVars.color.hover.self};
}
}
}
.ui.label.commit-sign-badge.github-theme-commit-sign-badge {
font-family:
-apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji";
font-weight: 500;
}
`;

View File

@@ -0,0 +1,108 @@
import { css, otherThemeVars, themeVars } from "src/types/vars";
const primary = "primary" as const;
const secondary = "secondary" as const;
const metadata = "metadata" as const;
const actions = "actions" as const;
export const commitsList = css`
ul.github-theme-templates-commits-list {
margin: 0;
padding: 0;
list-style: none;
li.github-theme-commit {
border-bottom: 1px solid ${themeVars.color.secondary.self};
padding: 8px 16px;
display: grid;
grid-template-areas: "${primary} ${metadata} ${actions}" "${secondary} ${metadata} ${actions}";
grid-template-rows: repeat(2, auto);
grid-template-columns: minmax(30%, 1fr) minmax(0, max-content) min-content;
&:last-child {
border-bottom: none;
border-bottom-left-radius: ${otherThemeVars.border.radius};
border-bottom-right-radius: ${otherThemeVars.border.radius};
}
&:hover {
background-color: ${themeVars.color.hover.opaque};
}
.message {
grid-area: ${primary};
.commit-summary {
font-size: 16px;
font-weight: 500;
white-space: pre-wrap;
}
.ellipsis-button {
padding: unset;
height: 1.5rem;
min-width: 1.75rem;
background: unset;
border: unset;
vertical-align: bottom;
&:hover {
background: ${themeVars.color.hover.self};
}
}
.commit-body {
font-size: 12px;
font-weight: 400;
color: ${themeVars.color.text.light.num1};
margin: 8px 0;
}
}
.metadata {
grid-area: ${secondary};
font-size: 12px;
color: ${themeVars.color.text.light.num1};
display: flex;
align-items: center;
flex-direction: row;
gap: 4px;
img.ui.avatar {
border-radius: 9999px;
margin-right: 4px;
}
.ui.label svg {
min-width: 12px;
min-height: 12px;
width: 12px;
height: 12px;
}
}
.extra {
grid-area: ${metadata};
display: flex;
align-items: center;
flex-direction: row;
flex-wrap: wrap;
column-gap: 8px;
.github-theme-tag {
border-width: 1.5px;
border-radius: 9999px;
height: 25px;
}
}
.actions {
grid-area: ${actions};
display: flex;
align-items: center;
flex-direction: row;
gap: 4px;
color: ${themeVars.color.text.light.num1};
.github-theme-action {
justify-content: center;
height: 28px;
width: 28px;
}
}
}
}
@media (max-width: 767.98px) {
ul.github-theme-templates-commits-list {
li.github-theme-commit {
grid-template-areas: "${primary} ${primary}" "${metadata} ${actions}" "${secondary} ${actions}";
grid-template-rows: repeat(3, auto);
}
}
}
`;

View File

@@ -0,0 +1,4 @@
import "./commit_sign_badge";
import "./commits_list";
import "./view_content";
import "./view_list";

View File

@@ -0,0 +1,38 @@
import { css, otherThemeVars, themeVars } from "src/types/vars";
export const repoButtonRow = css`
.github-theme-templates {
// 仓库按钮行
&.repo-button-row {
margin: 0 0 16px 0;
.repo-button-row-left .repository-summary {
> .item {
display: inline-flex;
align-items: center;
gap: 4px;
border-radius: ${otherThemeVars.border.radius};
color: ${themeVars.color.text.light.num1};
padding: 4px;
height: 32px;
min-height: 32px;
&:hover {
background-color: ${themeVars.github.control.transparent.bgColor.hover};
text-decoration-line: none;
}
svg {
margin-right: 4px;
}
b {
color: ${themeVars.color.caret};
}
}
}
.repo-button-row-right {
// 添加文件按钮菜单
.repo-add-file > .menu {
min-width: 152px;
}
}
}
}
`;

View File

@@ -0,0 +1,33 @@
import { css, otherThemeVars, themeVars } from "src/types/vars";
export const repoFileLastCommit = css`
// 仓库页和文件列表文件夹页的最后一次提交
.repository.file.list #repo-files-table .github-theme-templates.repo-file-line.repo-file-last-commit {
padding-right: 10px;
// 提交时间
.github-latest-time {
color: ${themeVars.color.text.light.num1};
font-size: 12px;
}
// 提交历史按钮
.github-latest-commit {
display: inline-flex;
align-items: center;
gap: 4px;
border-radius: ${otherThemeVars.border.radius};
padding: 0px 8px;
min-height: 28px;
height: 28px;
font-size: 12px;
font-weight: 500;
&:hover {
background-color: ${themeVars.github.control.transparent.bgColor.hover};
color: inherit;
text-decoration-line: none;
}
svg {
color: ${themeVars.color.text.light.num1};
}
}
}
`;

View File

@@ -0,0 +1,174 @@
<nav id="navbar" aria-label="{{ctx.Locale.Tr "aria.navbar"}}">
<div class="navbar-left">
<!-- the logo -->
<a class="item" id="navbar-logo" href="{{AppSubUrl}}/" aria-label="{{if .IsSigned}}{{ctx.Locale.Tr "dashboard"}}{{else}}{{ctx.Locale.Tr "home"}}{{end}}">
<img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{ctx.Locale.Tr "logo"}}" aria-hidden="true">
</a>
<!-- mobile right menu, it must be here because in mobile view, each item is a flex column, the first item is a full row column -->
<div class="ui secondary menu navbar-mobile-right only-mobile">
{{template "base/head_navbar_icons" dict "PageGlobalData" .PageGlobalData}}
<button class="item ui icon mini button tw-m-0" id="navbar-expand-toggle" aria-label="{{ctx.Locale.Tr "home.nav_menu"}}">{{svg "octicon-three-bars"}}</button>
</div>
<!-- navbar links non-mobile -->
{{if and .IsSigned .MustChangePassword}}
{{/* No links */}}
{{else if .IsSigned}}
{{if not (and ctx.Consts.RepoUnitTypeIssues.UnitGlobalDisabled ctx.Consts.RepoUnitTypePullRequests.UnitGlobalDisabled)}}
{{if .ShowMilestonesDashboardPage}}
<a class="item{{if .PageIsMilestonesDashboard}} active{{end}}" href="{{AppSubUrl}}/milestones">{{ctx.Locale.Tr "milestones"}}</a>
{{end}}
{{end}}
<a class="item{{if .PageIsExplore}} active{{end}}" href="{{AppSubUrl}}/explore/repos">{{ctx.Locale.Tr "explore"}}</a>
{{else if .IsLandingPageOrganizations}}
<a class="item{{if .PageIsExplore}} active{{end}}" href="{{AppSubUrl}}/explore/organizations">{{ctx.Locale.Tr "explore"}}</a>
{{else}}
<a class="item{{if .PageIsExplore}} active{{end}}" href="{{AppSubUrl}}/explore/repos">{{ctx.Locale.Tr "explore"}}</a>
{{end}}
{{template "custom/extra_links" .}}
{{if not .IsSigned}}
<a class="item" target="_blank" rel="noopener noreferrer" href="https://docs.gitea.com">{{ctx.Locale.Tr "help"}}</a>
{{end}}
</div>
<!-- the full dropdown menus -->
<div class="navbar-right">
{{if and .IsSigned .MustChangePassword}}
<div class="ui dropdown jump item" data-tooltip-content="{{ctx.Locale.Tr "user_profile_and_more"}}">
<span class="text">
{{ctx.AvatarUtils.Avatar .SignedUser 24 "tw-mr-1"}}
<span class="only-mobile">{{.SignedUser.Name}}</span>
<span class="not-mobile">{{svg "octicon-triangle-down"}}</span>
</span>
<div class="menu user-menu">
<div class="header">
{{ctx.Locale.Tr "signed_in_as"}} <strong>{{.SignedUser.Name}}</strong>
</div>
<div class="divider"></div>
<a class="item link-action" href data-url="{{AppSubUrl}}/user/logout">
{{svg "octicon-sign-out"}}
{{ctx.Locale.Tr "sign_out"}}
</a>
</div><!-- end content avatar menu -->
</div><!-- end dropdown avatar menu -->
{{else if .IsSigned}}
<div class="ui dropdown jump item" data-tooltip-content="{{ctx.Locale.Tr "create_new"}}">
<span class="text">
{{svg "octicon-plus"}}
<span class="not-mobile">{{svg "octicon-triangle-down"}}</span>
<span class="only-mobile">{{ctx.Locale.Tr "create_new"}}</span>
</span>
<div class="menu">
<a class="item" href="{{AppSubUrl}}/repo/create">
{{svg "octicon-plus"}} {{ctx.Locale.Tr "new_repo"}}
</a>
{{if not .DisableMigrations}}
<a class="item" href="{{AppSubUrl}}/repo/migrate">
{{svg "octicon-repo-push"}} {{ctx.Locale.Tr "new_migrate"}}
</a>
{{end}}
{{if .SignedUser.CanCreateOrganization}}
<a class="item" href="{{AppSubUrl}}/org/create">
{{svg "octicon-organization"}} {{ctx.Locale.Tr "new_org"}}
</a>
{{end}}
</div><!-- end content create new menu -->
</div><!-- end dropdown menu create new -->
{{template "base/head_navbar_icons" dict "ItemExtraClass" "not-mobile" "PageGlobalData" .PageGlobalData}}
<div class="ui dropdown jump item" data-tooltip-content="{{ctx.Locale.Tr "user_profile_and_more"}}">
<span class="text">
{{ctx.AvatarUtils.Avatar .SignedUser 24 "tw-mr-1"}}
<span class="only-mobile">{{.SignedUser.Name}}</span>
<span class="not-mobile">{{svg "octicon-triangle-down"}}</span>
</span>
<div class="menu user-menu">
<div class="header">
{{ctx.Locale.Tr "signed_in_as"}} <strong>{{.SignedUser.Name}}</strong>
</div>
<div class="divider"></div>
<a class="item" href="{{.SignedUser.HomeLink}}">
{{svg "octicon-person"}}
{{ctx.Locale.Tr "your_profile"}}
</a>
{{if not .DisableStars}}
<a class="item" href="{{.SignedUser.HomeLink}}?tab=stars">
{{svg "octicon-star"}}
{{ctx.Locale.Tr "your_starred"}}
</a>
{{end}}
<a class="item" href="{{AppSubUrl}}/notifications/subscriptions">
{{svg "octicon-bell"}}
{{ctx.Locale.Tr "notification.subscriptions"}}
</a>
<a class="{{if .PageIsUserSettings}}active {{end}}item" href="{{AppSubUrl}}/user/settings">
{{svg "octicon-tools"}}
{{ctx.Locale.Tr "your_settings"}}
</a>
<a class="item" target="_blank" rel="noopener noreferrer" href="https://docs.gitea.com">
{{svg "octicon-question"}}
{{ctx.Locale.Tr "help"}}
</a>
{{if .IsAdmin}}
<div class="divider"></div>
<a class="{{if .PageIsAdmin}}active {{end}}item" href="{{AppSubUrl}}/-/admin">
{{svg "octicon-server"}}
{{ctx.Locale.Tr "admin_panel"}}
</a>
{{end}}
<div class="divider"></div>
<a class="item link-action" href data-url="{{AppSubUrl}}/user/logout">
{{svg "octicon-sign-out"}}
{{ctx.Locale.Tr "sign_out"}}
</a>
</div><!-- end content avatar menu -->
</div><!-- end dropdown avatar menu -->
{{else}}
{{if .ShowRegistrationButton}}
<a class="item{{if .PageIsSignUp}} active{{end}}" href="{{AppSubUrl}}/user/sign_up">
{{svg "octicon-person"}}
<span class="tw-ml-1">{{ctx.Locale.Tr "register"}}</span>
</a>
{{end}}
<a class="item{{if .PageIsSignIn}} active{{end}}" rel="nofollow" href="{{AppSubUrl}}/user/login{{if not .PageIsSignIn}}?redirect_to={{.CurrentURL}}{{end}}">
{{svg "octicon-sign-in"}}
<span class="tw-ml-1">{{ctx.Locale.Tr "sign_in"}}</span>
</a>
{{end}}
</div><!-- end full right menu -->
{{$activeStopwatch := and .PageGlobalData (call .PageGlobalData.GetActiveStopwatch)}}
{{if $activeStopwatch}}
<div class="active-stopwatch-popup tippy-target">
<div class="tw-flex tw-items-center tw-gap-2 tw-p-3">
<a class="stopwatch-link tw-flex tw-items-center tw-gap-2 muted" href="{{$activeStopwatch.IssueLink}}">
{{svg "octicon-issue-opened" 16}}
<span class="stopwatch-issue">{{$activeStopwatch.RepoSlug}}#{{$activeStopwatch.IssueIndex}}</span>
</a>
<div class="tw-flex tw-gap-1">
<form class="stopwatch-commit form-fetch-action" method="post" action="{{$activeStopwatch.IssueLink}}/times/stopwatch/stop">
{{.CsrfTokenHtml}}
<button
type="submit"
class="ui button mini compact basic icon tw-mr-0"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.stop_tracking"}}"
>{{svg "octicon-square-fill"}}</button>
</form>
<form class="stopwatch-cancel form-fetch-action" method="post" action="{{$activeStopwatch.IssueLink}}/times/stopwatch/cancel">
{{.CsrfTokenHtml}}
<button
type="submit"
class="ui button mini compact basic icon tw-mr-0"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.cancel_tracking"}}"
>{{svg "octicon-trash"}}</button>
</form>
</div>
</div>
</div>
{{end}}
</nav>

View File

@@ -0,0 +1,35 @@
{{- $itemExtraClass := .ItemExtraClass -}}
{{- $data := .PageGlobalData -}}
{{if and $data $data.IsSigned}}{{/* data may not exist, for example: rendering 503 page before the PageGlobalData middleware */}}
{{- $activeStopwatch := call $data.GetActiveStopwatch -}}
{{- $notificationUnreadCount := call $data.GetNotificationUnreadCount -}}
{{if $activeStopwatch}}
<a class="item active-stopwatch {{$itemExtraClass}}" href="{{$activeStopwatch.IssueLink}}" title="{{ctx.Locale.Tr "active_stopwatch"}}" data-seconds="{{$activeStopwatch.Seconds}}">
<div class="tw-relative">
{{svg "octicon-stopwatch"}}
<span class="header-stopwatch-dot"></span>
</div>
</a>
{{end}}
{{if not ctx.Consts.RepoUnitTypeIssues.UnitGlobalDisabled}}
<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/issues" data-tooltip-content="{{ctx.Locale.Tr "issues"}}">
{{svg "octicon-issue-opened"}}
</a>
{{end}}
{{if not ctx.Consts.RepoUnitTypePullRequests.UnitGlobalDisabled}}
<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/pulls" data-tooltip-content="{{ctx.Locale.Tr "pull_requests"}}">
{{svg "octicon-git-pull-request"}}
</a>
{{end}}
<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/notifications" data-tooltip-content="{{ctx.Locale.Tr "notifications"}}">
<div class="tw-relative tw-h-[16px]">
{{svg "octicon-inbox"}}
<span class="notification_count{{if not $notificationUnreadCount}} tw-hidden{{end}}">{{$notificationUnreadCount}}</span>
</div>
</a>
{{if $data.IsSiteAdmin}}
<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/-/admin" data-tooltip-content="{{ctx.Locale.Tr "admin_panel"}}">
{{svg "octicon-server"}}
</a>
{{end}}
{{end}}

View File

@@ -0,0 +1,97 @@
{{/* Template attributes:
* Commit
* CommitBaseLink
* CommitSignVerification
If you'd like to modify this template, you could test it on the devtest page.
ATTENTION: this template could be re-rendered many times (on the graph and commit list page),
so this template should be kept as small as possible, DO NOT put large components like modal/dialog into it.
*/}}
{{- $commit := $.Commit -}}
{{- $commitBaseLink := $.CommitBaseLink -}}
{{- $verification := $.CommitSignVerification -}}{{- /* asymkey.CommitVerification */ -}}
{{- $extraClass := "" -}}
{{- $verified := false -}}
{{- $signingUser := NIL -}}
{{- $signingEmail := "" -}}
{{- $msgReasonPrefix := "" -}}
{{- $msgReason := "" -}}
{{- $msgSigningKey := "" -}}
{{- if $verification -}}
{{- $signingUser = $verification.SigningUser -}}
{{- $signingEmail = $verification.SigningEmail -}}
{{- $extraClass = print $extraClass " commit-is-signed" -}}
{{- if $verification.Verified -}}
{{- /* reason is "{name} / {key-id}" */ -}}
{{- $msgReason = $verification.Reason -}}
{{- $verified = true -}}
{{- if eq $verification.TrustStatus "trusted" -}}
{{- $extraClass = print $extraClass " sign-trusted" -}}
{{- else if eq $verification.TrustStatus "untrusted" -}}
{{- $extraClass = print $extraClass " sign-untrusted" -}}
{{- $msgReasonPrefix = ctx.Locale.Tr "repo.commits.signed_by_untrusted_user" -}}
{{- else -}}
{{- $extraClass = print $extraClass " sign-unmatched" -}}
{{- $msgReasonPrefix = ctx.Locale.Tr "repo.commits.signed_by_untrusted_user_unmatched" -}}
{{- end -}}
{{- else -}}
{{- if $verification.Warning -}}
{{- $extraClass = print $extraClass " sign-warning" -}}
{{- else -}}
{{- $extraClass = "" -}}{{/* the commit is not signed */}}
{{- end -}}
{{- $msgReason = ctx.Locale.Tr $verification.Reason -}}{{- /* dirty part: it is the translation key ..... */ -}}
{{- end -}}
{{- if $msgReasonPrefix -}}
{{- $msgReason = print $msgReasonPrefix ": " $msgReason -}}
{{- end -}}
{{- if $verification.SigningSSHKey -}}
{{- $msgSigningKey = print (ctx.Locale.Tr "repo.commits.ssh_key_fingerprint") ": " $verification.SigningSSHKey.Fingerprint -}}
{{- else if $verification.SigningKey -}}{{- /* asymkey.GPGKey */ -}}
{{- $msgSigningKey = print (ctx.Locale.Tr "repo.commits.gpg_key_id") ": " $verification.SigningKey.PaddedKeyID -}}
{{- end -}}
{{- end -}}
{{- $github_verifed := "github-theme.verifed" -}}
{{- $ctx_github_verifed := ctx.Locale.Tr $github_verifed -}}
{{- $github_partially_verifed := "github-theme.partially_verifed" -}}
{{- $ctx_github_partially_verifed := ctx.Locale.Tr $github_partially_verifed -}}
{{- $github_unverifed := "github-theme.unverifed" -}}
{{- $ctx_github_unverifed := ctx.Locale.Tr $github_unverifed -}}
{{- if $commit -}}
<a {{if $commitBaseLink}}href="{{$commitBaseLink}}/{{$commit.ID}}"{{end}} class="ui label commit-id-short {{$extraClass}} github-theme-commit-sha" rel="nofollow">
{{- end -}}
{{- if or (not $commit) $extraClass}}{{/* only show the lock icon if there is no commit info (icon only) or the commit is really signed */}}
<span class="ui label commit-sign-badge github-theme-commit-sign-badge {{$extraClass}}">
{{- if $verified -}}
{{- if and $signingUser $signingUser.ID -}}
<span data-tooltip-content="{{$msgReason}}">
{{if eq $ctx_github_verifed $github_verifed }}Verified
{{else}}{{$ctx_github_verifed}}{{end}}
</span>
<span data-tooltip-content="{{$msgSigningKey}}">{{ctx.AvatarUtils.Avatar $signingUser 16}}</span>
{{- else -}}
<span data-tooltip-content="{{$msgReason}}">
{{if eq $ctx_github_partially_verifed $github_partially_verifed }}Partially verified
{{else}}{{$ctx_github_partially_verifed}}{{end}}
</span>
<span data-tooltip-content="{{$msgSigningKey}}">{{ctx.AvatarUtils.AvatarByEmail $signingEmail "" 16}}</span>
{{- end -}}
{{- else -}}
<span data-tooltip-content="{{$msgReason}}">
{{if eq $ctx_github_unverifed $github_unverifed }}Unverified
{{else}}{{$ctx_github_unverifed}}{{end}}
</span>
{{- end -}}
</span>
{{- end -}}
{{- if $commit -}}
<span class="github-theme-sha">{{- ShortSha $commit.ID.String -}}</span>
</a>
{{- end -}}
{{- /* This template should be kept as small as possible, DO NOT put large components like modal/dialog into it. */ -}}

View File

@@ -0,0 +1,82 @@
<div class="ui attached table segment commit-table">
<ul class="github-theme-templates-commits-list">
{{$commitRepoLink := $.RepoLink}}{{if $.CommitRepoLink}}{{$commitRepoLink = $.CommitRepoLink}}{{end}}
{{range.Commits}}
<li class="github-theme-commit">
{{/* */}}
<div class="message">
{{if $.PageIsWiki}}
<span class="commit-summary" title="{{.Summary}}">{{.Summary | ctx.RenderUtils.RenderEmoji}}</span>
{{else}}
{{$commitLink:= printf "%s/commit/%s" $commitRepoLink (PathEscape .ID.String)}}
<span class="commit-summary" title="{{.Summary}}">{{ctx.RenderUtils.RenderCommitMessageLinkSubject .Message $commitLink $.Repository}}</span>
{{end}}
{{if IsMultilineCommitMessage .Message}}
<button class="ui button ellipsis-button" aria-expanded="false" data-global-click="onRepoEllipsisButtonClick">{{svg "octicon-ellipsis" 16}}</button>
{{end}}
{{if IsMultilineCommitMessage .Message}}
<pre class="commit-body tw-hidden">{{ctx.RenderUtils.RenderCommitBody .Message $.Repository}}</pre>
{{end}}
</div>
{{/* */}}
<div class="metadata">
{{/* */}}
{{$userName := .Author.Name}}
{{if .User}}
{{if and .User.FullName DefaultShowFullName}}
{{$userName = .User.FullName}}
{{end}}
{{ctx.AvatarUtils.Avatar .User 16}}<a class="muted author-wrapper" href="{{.User.HomeLink}}">{{$userName}}</a>
{{else}}
{{ctx.AvatarUtils.AvatarByEmail .Author.Email .Author.Name 16}}
<span class="author-wrapper">{{$userName}}</span>
{{end}}
{{/* */}}
·
{{if .Committer}}
{{DateUtils.TimeSince .Committer.When}}
{{else}}
{{DateUtils.TimeSince .Author.When}}
{{end}}
{{/* */}}
{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses}}
</div>
{{/* */}}
<div class="extra">
{{/* */}}
{{if $.CommitsTagsMap}}
{{range (index $.CommitsTagsMap .ID.String)}}
{{- template "repo/tag/name" dict "AdditionalClasses" "github-theme-tag" "RepoLink" $.Repository.Link "TagName" .TagName "IsRelease" (not .IsTag) -}}
{{end}}
{{end}}
{{$commitBaseLink := ""}}
{{if $.PageIsWiki}}
{{$commitBaseLink = printf "%s/wiki/commit" $commitRepoLink}}
{{else if $.PageIsPullCommits}}
{{$commitBaseLink = printf "%s/pulls/%d/commits" $commitRepoLink $.Issue.Index}}
{{else if $.Reponame}}
{{$commitBaseLink = printf "%s/commit" $commitRepoLink}}
{{end}}
{{template "repo/commit_sign_badge" dict "Commit" . "CommitBaseLink" $commitBaseLink "CommitSignVerification" .Verification}}
</div>
{{/* */}}
<div class="actions">
<button class="btn interact-bg copy-commit-id github-theme-action" data-tooltip-content="{{ctx.Locale.Tr "copy_hash"}}" data-clipboard-text="{{.ID}}">{{svg "octicon-copy"}}</button>
{{/* at the moment, wiki doesn't support these "view" links like "view at history point" */}}
{{if not $.PageIsWiki}}
{{/* view single file diff */}}
{{if $.FileTreePath}}
<a class="btn interact-bg view-single-diff github-theme-action" data-tooltip-content="{{ctx.Locale.Tr "repo.commits.view_file_diff"}}"
href="{{$commitRepoLink}}/commit/{{.ID.String}}?files={{$.FileTreePath}}"
>{{svg "octicon-file-diff"}}</a>
{{end}}
{{/* view at history point */}}
{{$viewCommitLink := printf "%s/src/commit/%s" $commitRepoLink (PathEscape .ID.String)}}
{{if $.FileTreePath}}{{$viewCommitLink = printf "%s/%s" $viewCommitLink (PathEscapeSegments $.FileTreePath)}}{{end}}
<a class="btn interact-bg view-commit-path github-theme-action" data-tooltip-content="{{ctx.Locale.Tr "repo.commits.view_path"}}" href="{{$viewCommitLink}}">{{svg "octicon-code"}}</a>
{{end}}
</div>
</li>
{{end}}
</ul>
</div>

View File

@@ -0,0 +1,106 @@
{{$isTreePathRoot := not .TreeNames}}
<div class="repo-view-content-data tw-hidden" data-document-title="{{ctx.RootData.Title}}" data-document-title-common="{{ctx.RootData.PageTitleCommon}}"></div>
{{/* {{template "repo/sub_menu" .}} */}}
<div class="github-theme-templates repo-button-row">
<div class="repo-button-row-left">
{{if not $isTreePathRoot}}
<button class="repo-view-file-tree-toggle-show ui compact basic button icon not-mobile {{if .UserSettingCodeViewShowFileTree}}tw-hidden{{end}}"
data-global-click="onRepoViewFileTreeToggle" data-toggle-action="show"
data-tooltip-content="{{ctx.Locale.Tr "repo.diff.show_file_tree"}}">
{{svg "octicon-sidebar-collapse"}}
</button>
{{end}}
{{template "repo/branch_dropdown" dict
"Repository" .Repository
"ShowTabBranches" true
"ShowTabTags" true
"CurrentRefType" .RefFullName.RefType
"CurrentRefShortName" .RefFullName.ShortName
"CurrentTreePath" .TreePath
"RefLinkTemplate" "{RepoLink}/src/{RefType}/{RefShortName}/{TreePath}"
"AllowCreateNewRef" .CanCreateBranch
"ShowViewAllRefsEntry" true
}}
{{if and $isTreePathRoot (.Permission.CanRead ctx.Consts.RepoUnitTypeCode) (not .IsEmptyRepo)}}
<div class="repository-summary">
<a class="item muted" href="{{.RepoLink}}/branches">
{{svg "octicon-git-branch"}} <b>{{ctx.Locale.PrettyNumber .BranchesCount}}</b> {{ctx.Locale.TrN .BranchesCount "repo.branch" "repo.branches"}}
</a>
{{if $.Permission.CanRead ctx.Consts.RepoUnitTypeCode}}
<a class="item muted" href="{{.RepoLink}}/tags">
{{svg "octicon-tag"}} <b>{{ctx.Locale.PrettyNumber .NumTags}}</b> {{ctx.Locale.TrN .NumTags "repo.tag" "repo.tags"}}
</a>
{{end}}
</div>
{{end}}
{{if not $isTreePathRoot}}
{{$treeNameIdxLast := Eval (len .TreeNames) "-" 1}}
<span class="breadcrumb">
<a class="section" href="{{.RepoLink}}/src/{{.RefTypeNameSubURL}}" title="{{.Repository.Name}}">{{StringUtils.EllipsisString .Repository.Name 30}}</a>
{{- range $i, $v := .TreeNames -}}
<span class="breadcrumb-divider">/</span>
{{- if eq $i $treeNameIdxLast -}}
<span class="active section" title="{{$v}}">{{$v}}</span>
<button class="btn interact-fg tw-mx-1" data-clipboard-text="{{$.TreePath}}" data-tooltip-content="{{ctx.Locale.Tr "copy_path"}}">{{svg "octicon-copy" 14}}</button>
{{- else -}}
{{$p := index $.Paths $i}}<span class="section"><a href="{{$.BranchLink}}/{{PathEscapeSegments $p}}" title="{{$v}}">{{$v}}</a></span>
{{- end -}}
{{- end -}}
</span>
{{end}}
</div>
<div class="repo-button-row-right">
<!-- Show go to file if on home page -->
{{if $isTreePathRoot}}
<a href="{{.Repository.Link}}/find/{{.RefTypeNameSubURL}}" class="ui compact basic button">{{ctx.Locale.Tr "repo.find_file.go_to_file"}}</a>
{{end}}
{{if and .RefFullName.IsBranch (not .IsViewFile)}}
<button class="ui dropdown basic compact jump button repo-add-file" {{if not .Repository.CanEnableEditor}}disabled{{end}}>
{{ctx.Locale.Tr "repo.editor.add_file"}}
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu">
<a class="item" href="{{.RepoLink}}/_new/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
{{svg "octicon-plus" 16}}{{ctx.Locale.Tr "repo.editor.new_file"}}
</a>
{{if .RepositoryUploadEnabled}}
<a class="item" href="{{.RepoLink}}/_upload/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
{{svg "octicon-upload" 16}}{{ctx.Locale.Tr "repo.editor.upload_file"}}
</a>
{{end}}
<a class="item" href="{{.RepoLink}}/_diffpatch/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
{{svg "octicon-diff" 16}}{{ctx.Locale.Tr "repo.editor.patch"}}
</a>
</div>
</button>
{{end}}
{{if and $isTreePathRoot .Repository.IsTemplate}}
<a role="button" class="ui primary compact button" href="{{AppSubUrl}}/repo/create?template_id={{.Repository.ID}}">
{{ctx.Locale.Tr "repo.use_template"}}
</a>
{{end}}
<!-- Only show clone panel in repository home page -->
{{if $isTreePathRoot}}
{{template "repo/clone_panel" .}}
{{end}}
</div>
</div>
{{if .IsViewFile}}
{{template "repo/view_file" .}}
{{else if .IsBlame}}
{{template "repo/blame" .}}
{{else}}{{/* IsViewDirectory */}}
{{if $isTreePathRoot}}
{{template "repo/code/upstream_diverging_info" .}}
{{end}}
{{template "repo/view_list" .}}
{{if and .ReadmeExist (or .IsMarkup .IsPlainText)}}
{{template "repo/view_file" .}}
{{end}}
{{end}}

View File

@@ -0,0 +1,79 @@
{{/* use grid layout, still use the old ID because there are many other CSS styles depending on this ID */}}
<div id="repo-files-table" {{if .HasFilesWithoutLatestCommit}}hx-indicator="#repo-files-table .repo-file-cell.message" hx-trigger="load" hx-swap="morph" hx-post="{{.LastCommitLoaderURL}}"{{end}}>
<div class="github-theme-templates repo-file-line repo-file-last-commit">
{{template "repo/latest_commit" .}}
<div class="github-latest-time">
{{if and .LatestCommit .LatestCommit.Committer}}
<a href="{{ (print .RepoLink "/commit") }}/{{.LatestCommit.ID}}" class="muted" rel="nofollow">
{{- ShortSha .LatestCommit.ID.String -}}
</a>
·
{{DateUtils.TimeSince .LatestCommit.Committer.When}}
{{end}}
</div>
{{if and (not .TreeNames) (.Permission.CanRead ctx.Consts.RepoUnitTypeCode) (not .IsEmptyRepo)}}
<a class="github-latest-commit item muted" href="{{.RepoLink}}/commits/{{.RefFullName.RefWebLinkPath}}">
{{svg "octicon-history" 16}} <b>{{ctx.Locale.PrettyNumber .CommitsCount}}</b> {{ctx.Locale.TrN .CommitsCount "repo.commit" "repo.commits"}}
</a>
{{end}}
{{if and .TreeNames (not .IsViewFile) (not .IsBlame)}}{{/* IsViewDirectory (not home), TODO: split the templates, avoid using "if" tricks */}}
<a class="github-latest-commit item muted" href="{{.RepoLink}}/commits/{{.RefTypeNameSubURL}}/{{.TreePath | PathEscapeSegments}}">
{{svg "octicon-history" 16}}{{ctx.Locale.Tr "repo.file_history"}}
</a>
{{end}}
</div>
{{$.FileIconPoolHTML}}
{{if .HasParentPath}}
<a class="repo-file-line parent-link silenced" href="{{.BranchLink}}{{if .ParentPath}}{{PathEscapeSegments .ParentPath}}{{end}}">
{{index $.FileIcons ".."}} ..
</a>
{{end}}
{{range $item := .Files}}
<div class="repo-file-item">
{{$entry := $item.Entry}}
{{$commit := $item.Commit}}
{{$submoduleFile := $item.SubmoduleFile}}
<div class="repo-file-cell name muted-links {{if not $commit}}notready{{end}}">
{{index $.FileIcons $entry.Name}}
{{if $entry.IsSubModule}}
{{$submoduleLink := $submoduleFile.SubmoduleWebLinkTree ctx}}
{{if $submoduleLink}}
<a class="entry-name" href="{{$submoduleLink.RepoWebLink}}" title="{{$entry.Name}}">{{$entry.Name}}</a>
@ <a class="text primary" href="{{$submoduleLink.CommitWebLink}}">{{ShortSha $submoduleFile.RefID}}</a>
{{else}}
<span class="entry-name" title="{{$entry.Name}}">{{$entry.Name}}</span>
@ {{ShortSha $submoduleFile.RefID}}
{{end}}
{{else}}
{{if $entry.IsDir}}
{{$subJumpablePathName := $entry.GetSubJumpablePathName}}
<a class="entry-name" href="{{$.TreeLink}}/{{PathEscapeSegments $subJumpablePathName}}" title="{{$subJumpablePathName}}">
{{$subJumpablePathFields := StringUtils.Split $subJumpablePathName "/"}}
{{$subJumpablePathFieldLast := (Eval (len $subJumpablePathFields) "-" 1)}}
{{if eq $subJumpablePathFieldLast 0}}
{{$subJumpablePathName}}
{{else}}
{{$subJumpablePathPrefixes := slice $subJumpablePathFields 0 $subJumpablePathFieldLast}}
<span class="text light-2">{{StringUtils.Join $subJumpablePathPrefixes "/"}}</span>/{{index $subJumpablePathFields $subJumpablePathFieldLast}}
{{end}}
</a>
{{else}}
<a class="entry-name" href="{{$.TreeLink}}/{{PathEscapeSegments $entry.Name}}" title="{{$entry.Name}}">{{$entry.Name}}</a>
{{if $entry.IsLink}}
<a class="entry-symbol-link flex-text-inline" data-tooltip-content title="{{ctx.Locale.Tr "repo.find_file.follow_symlink"}}" href="{{$.TreeLink}}/{{PathEscapeSegments $entry.Name}}?follow_symlink=1">{{svg "octicon-link" 12}}</a>
{{end}}
{{end}}
{{end}}
</div>
<div class="repo-file-cell message loading-icon-2px">
{{if $commit}}
{{$commitLink := printf "%s/commit/%s" $.RepoLink (PathEscape $commit.ID.String)}}
{{ctx.RenderUtils.RenderCommitMessageLinkSubject $commit.Message $commitLink $.Repository}}
{{else}}
{{/* will be loaded again by LastCommitLoaderURL */}}
{{end}}
</div>
<div class="repo-file-cell age">{{if $commit}}{{DateUtils.TimeSince $commit.Committer.When}}{{end}}</div>
</div>
{{end}}
</div>

View File

@@ -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" },
@@ -24,7 +25,7 @@ export const colorblindDarkGithubColors: GithubColor = {
},
bgColor: {
...darkGithubColors.bgColor,
danger: { muted: "#db6d281a" },
danger: { emphasis: "#bd561d", muted: "#db6d281a" },
success: { emphasis: "#1f6feb", muted: "#388bfd33" },
},
borderColor: {

View File

@@ -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" },
@@ -24,7 +25,7 @@ export const colorblindLightGithubColors: GithubColor = {
},
bgColor: {
...lightGithubColors.bgColor,
danger: { muted: "#fff1e5" },
danger: { emphasis: "#bc4c00", muted: "#fff1e5" },
success: { emphasis: "#0969da", muted: "#ddf4ff" },
},
borderColor: {

View File

@@ -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" },
@@ -41,8 +45,8 @@ export const darkGithubColors: GithubColor = {
},
bgColor: {
accent: { emphasis: "#1f6feb", muted: "#388bfd1a" },
attention: { muted: "#bb800926" },
danger: { muted: "#f851491a" },
attention: { emphasis: "#9e6a03", muted: "#bb800926" },
danger: { emphasis: "#da3633", muted: "#f851491a" },
default: "#0d1117",
done: { emphasis: "#8957e5" },
emphasis: "#3d444d",

View File

@@ -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" },
@@ -41,8 +45,8 @@ export const lightGithubColors: GithubColor = {
},
bgColor: {
accent: { emphasis: "#0969da", muted: "#ddf4ff" },
attention: { muted: "#fff8c5" },
danger: { muted: "#ffebe9" },
attention: { emphasis: "#9a6700", muted: "#fff8c5" },
danger: { emphasis: "#cf222e", muted: "#ffebe9" },
default: "#ffffff",
done: { emphasis: "#8250df" },
emphasis: "#25292e",

View File

@@ -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" },
@@ -35,8 +39,8 @@ export const softDarkGithubColors: GithubColor = {
},
bgColor: {
accent: { emphasis: "#316dca", muted: "#4184e41a" },
attention: { muted: "#ae7c1426" },
danger: { muted: "#e5534b1a" },
attention: { emphasis: "#966600", muted: "#ae7c1426" },
danger: { emphasis: "#c93c37", muted: "#e5534b1a" },
default: "#212830",
done: { emphasis: "#8256d0" },
emphasis: "#3d444d",

View File

@@ -30,11 +30,11 @@
"erasableSyntaxOnly": true,
"noFallthroughCasesInSwitch": true,
"noUncheckedSideEffectImports": true,
"baseUrl": ".",
"paths": {
"src/*": ["src/*"],
"styles/*": ["styles/*"],
"themes/*": ["themes/*", "themes/*.css"]
"*": ["./*"],
"src/*": ["./src/*"],
"styles/*": ["./styles/*"],
"themes/*": ["./themes/*", "./themes/*.css"]
}
},
"include": ["src", "styles", "themes", "vite.config.ts"]

View File

@@ -8,9 +8,8 @@ import * as sass from "sass-embedded";
import { defineConfig } from "vite";
import { themeInput, themePlugin } from "./src/core/vite";
dotenv.config({ quiet: true });
const require = createRequire(import.meta.url);
dotenv.config({ quiet: true });
const outDir = "dist"; // 输出目录
const themesDir = "themes"; // 颜色主题目录