Compare commits

...

13 Commits

Author SHA1 Message Date
lutinglt
c766a16b08 1.24.7 2025-10-25 13:03:41 +08:00
lutinglt
77faa2ce63 update readme 2025-10-25 10:55:07 +08:00
lutinglt
4267c98dbe update readme 2025-10-25 10:48:44 +08:00
lutinglt
558f75de42 VSCode 和 VSCodium 图标添加颜色 2025-10-13 11:58:48 +08:00
lutinglt
6fe0241007 修复手机下仪表板二级导航栏用户菜单按钮没有居中的问题 2025-10-12 12:21:30 +08:00
lutinglt
b790f73fdf update README 2025-10-12 00:02:28 +08:00
lutinglt
db6ec59a83 update CHANGELOG 2025-10-11 23:39:02 +08:00
lutinglt
23658a4917 统一无搜索结果时的样式 #20 2025-10-11 23:35:34 +08:00
lutinglt
0e3628863e 修复仓库探索无搜索结果时的样式 #20 2025-10-11 22:45:51 +08:00
lutinglt
d178870ea8 update readme 2025-10-11 18:05:13 +08:00
lutinglt
38874d8b43 同步工作流运行页面的运行时间字体样式和重新运行按钮样式 2025-10-11 17:45:08 +08:00
lutinglt
1a5db58b4f 修复差异对比文件路径标题栏的菜单样式问题 2025-10-09 21:29:39 +08:00
lutinglt
05a4dc4f8a 优化下拉菜单的样式&同步亮色和柔和暗色主题下的菜单颜色 2025-09-28 21:37:15 +08:00
17 changed files with 195 additions and 36 deletions

View File

@@ -1,12 +1,17 @@
### 🌈 Style ### 🌈 Style
- 优化顶部和二级导航栏的样式和颜色 - 优化顶部和二级导航栏的样式和颜色 #18
##### 更符合 GitHub 风格 ##### 更符合 GitHub 风格
- 修复并同步工单或 PR 详细页面下的标签菜单样式 #19 - 修复并同步工单或 PR 详细页面下的标签菜单样式 #19
- 统一仓库/用户/组织列表无搜索结果时的样式 #20
- 同步页脚样式 - 同步页脚样式
- 优化下拉菜单的样式
- 优化创建标签菜单的菜单项的样式 - 优化创建标签菜单的菜单项的样式
- 同步亮色和柔和暗色主题下的菜单颜色
- 同步工作流运行页面的运行时间字体样式和重新运行按钮样式
- VSCode 和 VSCodium 图标添加颜色
### 🐞 Fix ### 🐞 Fix
@@ -16,3 +21,31 @@
- 修复仓库页面下二级导航栏下划线过粗的问题 - 修复仓库页面下二级导航栏下划线过粗的问题
- 修复仪表板切换用户按钮菜单下无创建组织按钮时的菜单圆角问题 - 修复仪表板切换用户按钮菜单下无创建组织按钮时的菜单圆角问题
- 修复导航栏工单/PR等仪表板下筛选等菜单的子项的间距问题 - 修复导航栏工单/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

View File

@@ -1,9 +1,20 @@
<p align="center"> <h1 align="center">
中文 | <p>Gitea GitHub Theme</p>
<a href="./README_EN.md">English</a> <img src="https://img.shields.io/github/issues-raw/lutinglt/gitea-github-theme?style=for-the-badge&labelColor=25292e&color=1a7f37">
</p> <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>
# Gitea GitHub Theme <div align="center">
中文 • [English](README_EN.md)
不仅仅是在颜色上, 在样式细节上也追求 GitHub 风格的 Gitea 主题.
</div>
![Dashboard](screenshots/dashboard.png)
> [!TIP] > [!TIP]
> >
@@ -24,6 +35,12 @@ Gitea 理论上小版本号变更不会修改前端布局, 所以主题的小版
> 开发阶段的主题版本号格式: `1.大版本号.小版本号.时间戳` > 开发阶段的主题版本号格式: `1.大版本号.小版本号.时间戳`
### 主题版本发布规则
- 当 Gitea 发布小版本时, 主题中间如有变更, 则发布新的和 Gitea 小版本相同的主题版本
- 当 Gitea 发布大版本时, 主题中间如有变更, 会发布 `1.旧大版本号.latest` 的主题版本并不再维护旧版本
- 适配大版本的预发布版本为 `1.大版本号.rc`, 当无明显 BUG 时发布与 Gitea 大版本相同的主题版本
## 安装 ## 安装
1. 在发布页下载最新的 CSS 主题文件放入 `gitea/public/assets/css` 目录下 1. 在发布页下载最新的 CSS 主题文件放入 `gitea/public/assets/css` 目录下
@@ -49,8 +66,6 @@ THEMES = gitea-auto, gitea-light, gitea-dark, github-auto, github-light, github-
## 截图 ## 截图
![Dashboard](screenshots/dashboard.png)
### 基本主题 ### 基本主题
```ini ```ini
@@ -149,7 +164,3 @@ npm run build
编译完成后, 会在 `dist` 目录下生成主题文件, 你可以将主题文件放入 `gitea/public/assets/css` 目录下, 然后在 编译完成后, 会在 `dist` 目录下生成主题文件, 你可以将主题文件放入 `gitea/public/assets/css` 目录下, 然后在
`gitea/conf/app.ini` 中添加主题名称到 `THEMES` 末尾 `gitea/conf/app.ini` 中添加主题名称到 `THEMES` 末尾
## 贡献
请查看 [CONTRIBUTING](CONTRIBUTING.md)

View File

@@ -1,9 +1,20 @@
<p align="center"> <h1 align="center">
<a href="./README.md">中文</a> | <p>Gitea GitHub Theme</p>
English <img src="https://img.shields.io/github/issues-raw/lutinglt/gitea-github-theme?style=for-the-badge&labelColor=25292e&color=1a7f37">
</p> <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>
# Gitea GitHub Theme <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] > [!TIP]
> >
@@ -26,6 +37,15 @@ accepted.
> Development stage theme version number format: `1.major.minor.timestamp` > 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 ## Installation
1. Download the latest CSS theme file from the release page and place it in the `gitea/public/assets/css` directory 1. Download the latest CSS theme file from the release page and place it in the `gitea/public/assets/css` directory
@@ -52,8 +72,6 @@ For details, please refer to the Gitea documentation
## Screenshots ## Screenshots
![Dashboard](screenshots/en/dashboard-en.png)
### Basic Themes ### Basic Themes
```ini ```ini
@@ -153,7 +171,3 @@ npm run build
After compilation, theme files will be generated in the `dist` directory. You can place the theme files into the 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` `gitea/public/assets/css` directory, then add the theme name to the end of `THEMES` in `gitea/conf/app.ini`
## Contribution
Please refer to [CONTRIBUTING](CONTRIBUTING.md)

View File

@@ -31,7 +31,7 @@
"typescript-eslint": "^8.34.1", "typescript-eslint": "^8.34.1",
"typescript-plugin-css-modules": "^5.1.0", "typescript-plugin-css-modules": "^5.1.0",
"typescript-styled-plugin": "^0.18.3", "typescript-styled-plugin": "^0.18.3",
"vite": "^6.3.5" "vite": "^7.1.9"
}, },
"prettier": { "prettier": {
"printWidth": 120, "printWidth": 120,

View File

@@ -70,7 +70,7 @@ export type GithubColor = {
transparent: { bgColor: { active: string; hover: string; selected: string } }; transparent: { bgColor: { active: string; hover: string; selected: string } };
}; };
shadow: { floating: { small: string }; resting: { small: string } }; shadow: { floating: { small: string }; resting: { small: string } };
overlay: { backdrop: { bgColor: string } }; overlay: { backdrop: { bgColor: string }; bgColor: string };
underlineNav: { borderColor: { active: string } }; underlineNav: { borderColor: { active: string } };
contribution: { contribution: {
default: { default: {
@@ -91,7 +91,7 @@ export function github2ThemeColor(githubColor: GithubColor): ThemeColor {
activeBg: githubColor.control.bgColor.active, activeBg: githubColor.control.bgColor.active,
hoverBg: githubColor.control.transparent.bgColor.hover, hoverBg: githubColor.control.transparent.bgColor.hover,
menu: { menu: {
bg: githubColor.bgColor.inset, bg: githubColor.overlay.bgColor,
border: githubColor.borderColor.muted, border: githubColor.borderColor.muted,
}, },
}; };
@@ -169,7 +169,7 @@ export function github2ThemeColor(githubColor: GithubColor): ThemeColor {
opaque: themeVars.color.box.header, opaque: themeVars.color.box.header,
}, },
active: githubColor.control.transparent.bgColor.selected, active: githubColor.control.transparent.bgColor.selected,
menu: githubColor.bgColor.inset, menu: githubColor.overlay.bgColor,
card: themeVars.color.body, card: themeVars.color.body,
markup: { markup: {
tableRow: githubColor.bgColor.muted, tableRow: githubColor.bgColor.muted,

View File

@@ -61,7 +61,7 @@ export const actions = css`
.run-list-ref { .run-list-ref {
background-color: ${themeVars.github.bgColor.accent.muted}; background-color: ${themeVars.github.bgColor.accent.muted};
color: ${themeVars.github.fgColor.accent}; color: ${themeVars.github.fgColor.accent};
font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace); font-family: var(--fonts-monospace);
font-weight: 400; font-weight: 400;
&:hover { &:hover {
background-color: ${themeVars.github.bgColor.accent.muted}; background-color: ${themeVars.github.bgColor.accent.muted};
@@ -193,6 +193,26 @@ export const actionViewLeft = css`
width: 4px; width: 4px;
} }
} }
.job-brief-item-right {
svg.job-brief-rerun {
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);
}
}
&:hover {
.job-brief-item-right {
svg.job-brief-rerun {
display: inline-block;
}
}
}
} }
} }
} }
@@ -249,6 +269,11 @@ export const actionViewRight = css`
color: ${themeVars.color.console.fg.self} !important; color: ${themeVars.color.console.fg.self} !important;
} }
} }
// 步骤耗时
.step-summary-duration {
font-size: 12px;
font-family: var(--fonts-monospace);
}
} }
// 步骤日志 // 步骤日志
.job-step-logs { .job-step-logs {

View File

@@ -92,7 +92,7 @@ export const clone = css`
.item { .item {
border-radius: ${otherThemeVars.border.radius}; border-radius: ${otherThemeVars.border.radius};
padding: 6px 8px; padding: 6px 8px;
line-height: 1.5; height: 32px;
margin: 0; margin: 0;
svg { svg {
color: ${themeVars.color.text.light.num1}; color: ${themeVars.color.text.light.num1};

View File

@@ -157,3 +157,33 @@ export const mobileList = css`
} }
} }
`; `;
// 统一无搜索结果时的样式
export const notMatch = css`
// 组织的仓库列表
.page-content.organization.profile > .ui.container > .ui.stackable > .ui.eleven,
// 用户的仓库列表
.page-content.user.profile > .ui.container > .ui.stackable > .ui.twelve,
// 探索的仓库列表
.page-content.explore.repositories > .ui.container,
// 组织的成员列表
.page-content.organization.members >.ui.container,
// 探索的用户和组织列表
.page-content.explore.users >.ui.container {
// 排除用户的公开活动页
> .flex-list:not(#activity-feed) {
&:has(> div:only-child):not(:has(.flex-item-main)) {
grid-template-columns: 1fr;
> div {
border: 1px solid ${themeVars.color.light.border};
border-radius: ${otherThemeVars.border.radius};
font-size: 16px;
font-weight: 500;
padding: 32px;
display: flex;
justify-content: center;
}
}
}
}
`;

View File

@@ -655,7 +655,8 @@ export const issueSidebar = css`
.ui.form .due-date { .ui.form .due-date {
color: ${themeVars.color.text.self}; color: ${themeVars.color.text.self};
} }
.divider { // 分割线
> .divider {
margin: 12px 0 12px 8px; margin: 12px 0 12px 8px;
width: calc(100% - 16px); width: calc(100% - 16px);
} }

View File

@@ -156,6 +156,9 @@ export const secondaryNav = css`
gap: 0px; gap: 0px;
min-height: 48px; min-height: 48px;
> .item { > .item {
// 修复手机下的菜单按钮没有居中的问题
margin-top: auto;
margin-bottom: auto;
> .ui.dropdown > .text { > .ui.dropdown > .text {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;

View File

@@ -19,6 +19,7 @@ export const dropdown = css`
align-items: center; align-items: center;
align-content: center; align-content: center;
padding: 6px 8px !important; padding: 6px 8px !important;
min-height: 32px;
border-radius: ${otherThemeVars.border.radius} !important; border-radius: ${otherThemeVars.border.radius} !important;
gap: 4px; gap: 4px;
&:not(.emoji) { &:not(.emoji) {
@@ -255,6 +256,32 @@ export const branchDropdown = css`
max-width: 640px; max-width: 640px;
> .menu > .item { > .menu > .item {
animation: ${animationDown}; animation: ${animationDown};
height: 32px;
}
// 分支/标签切换
> .branch-tag-tab {
> .branch-tag-item {
font-weight: 500;
padding: 8px 12px;
height: 32px;
line-height: 1.15;
svg {
display: none;
}
&.active {
background: ${themeVars.color.body};
}
&:hover {
color: inherit;
&:not(.active) {
background: ${themeVars.color.hover.self};
border: 1px solid ${themeVars.color.secondary.self};
border-bottom: 0;
border-top-left-radius: ${otherThemeVars.border.radius};
border-top-right-radius: ${otherThemeVars.border.radius};
}
}
}
} }
} }
`; `;

View File

@@ -39,4 +39,8 @@ export const input = css`
.ui.form#repo-search-form { .ui.form#repo-search-form {
align-items: center; align-items: center;
} }
// 下拉菜单的输入框
.ui.dropdown.dropdown .menu>.input {
margin: 12px 10px;
}
`; `;

View File

@@ -8,9 +8,17 @@ export const listHeader = css`
} }
`; `;
// 已标星的图标 export const svg = css`
export const star = css` // 已标星的图标
.octicon-star-fill { .octicon-star-fill {
color: ${themeVars.github.button.star.iconColor} !important; color: ${themeVars.github.button.star.iconColor} !important;
} }
// VSCode 图标
.gitea-vscode {
color: #007acc !important;
}
// VSCodium 图标
.gitea-vscodium {
color: #429cf0 !important;
}
`; `;

View File

@@ -15,7 +15,8 @@ export const tippyBox = css`
border: unset; border: unset;
box-shadow: ${themeVars.github.shadow.floating.small}; box-shadow: ${themeVars.github.shadow.floating.small};
} }
&[data-theme="default"] { &[data-theme="default"],
&[data-theme="menu"] {
border-radius: 12px; border-radius: 12px;
} }
&[data-theme="box-with-header"] { &[data-theme="box-with-header"] {
@@ -32,6 +33,8 @@ export const tippyBox = css`
padding: 8px; padding: 8px;
.item { .item {
border-radius: ${otherThemeVars.border.radius}; border-radius: ${otherThemeVars.border.radius};
padding: 6px 8px;
height: 32px;
&:hover { &:hover {
background-color: ${themeVars.github.control.transparent.bgColor.hover}; background-color: ${themeVars.github.control.transparent.bgColor.hover};
} }

View File

@@ -73,7 +73,7 @@ export const darkGithubColors: GithubColor = {
transparent: { bgColor: { active: "#656c7640", hover: "#656c7633", selected: "#656c761a" } }, transparent: { bgColor: { active: "#656c7640", hover: "#656c7633", selected: "#656c761a" } },
}, },
shadow: { floating: { small: "#01040966" }, resting: { small: "#01040999" } }, shadow: { floating: { small: "#01040966" }, resting: { small: "#01040999" } },
overlay: { backdrop: { bgColor: "#21283066" } }, overlay: { backdrop: { bgColor: "#21283066" }, bgColor: "#010409" },
underlineNav: { borderColor: { active: "#f78166" } }, underlineNav: { borderColor: { active: "#f78166" } },
contribution: { contribution: {
default: { default: {

View File

@@ -73,7 +73,7 @@ export const lightGithubColors: GithubColor = {
transparent: { bgColor: { active: "#818b9826", hover: "#818b981a", selected: "#818b9826" } }, transparent: { bgColor: { active: "#818b9826", hover: "#818b981a", selected: "#818b9826" } },
}, },
shadow: { floating: { small: "#25292e0a" }, resting: { small: "#1f23280f" } }, shadow: { floating: { small: "#25292e0a" }, resting: { small: "#1f23280f" } },
overlay: { backdrop: { bgColor: "#c8d1da66" } }, overlay: { backdrop: { bgColor: "#c8d1da66" }, bgColor: "#ffffff" },
underlineNav: { borderColor: { active: "#fd8c73" } }, underlineNav: { borderColor: { active: "#fd8c73" } },
contribution: { contribution: {
default: { default: {

View File

@@ -67,7 +67,7 @@ export const softDarkGithubColors: GithubColor = {
transparent: { bgColor: { active: "#656c7633", hover: "#656c7626", selected: "#656c761a" } }, transparent: { bgColor: { active: "#656c7633", hover: "#656c7626", selected: "#656c761a" } },
}, },
shadow: { floating: { small: "#01040966" }, resting: { small: "#01040999" } }, shadow: { floating: { small: "#01040966" }, resting: { small: "#01040999" } },
overlay: { backdrop: { bgColor: "#262c3666" } }, overlay: { backdrop: { bgColor: "#262c3666" }, bgColor: "#2a313c" },
underlineNav: { borderColor: { active: "#ec775c" } }, underlineNav: { borderColor: { active: "#ec775c" } },
contribution: { contribution: {
default: { default: {