页脚样式调整

.github/release-template.md

@@ -15,3 +15,7 @@
 #### CSS Variable
 
 ##### More GitHub-like style
+
+```text
+在 English 下方补充上面 Feature 以下部分的内容的中译英​
+```

.github/release.md

@@ -1,87 +1,13 @@
-### 🎉 已完成大部分页面的 GitHub 风格 ( GitHub Style Completed for Most Pages )
-
-如果您仍在使用旧版本，强烈建议更新至本版本。此版本已为大部分常用页面实现了 GitHub 风格设计，提供了更强的一致性，并修复了若干已知问题。
-
-由于布局限制，项目和百科页面的 GitHub 风格适配方案尚未确定。
-
-If you are still using an older version, we highly recommend updating to this release. This version has implemented the
-GitHub-style design for most commonly used pages, ensuring stronger consistency, and addresses several known issues.
-
-Due to layout constraints, the approach for adapting the GitHub style to Project and Wiki pages has not yet been
-determined.
-
-### ✨ Feature
-
-- 新增粉色颜色主题
-- 修改外观设置中显示的主题名称
-
-#### CSS 变量
-
-- 新增 `--custom-branch-menu-width` 变量, 用于设置分支菜单的宽度
-- 新增 `--custom-user-menu-width` 变量, 用于设置用户菜单的宽度
-
 ### 🌈 Style
 
-- 优化用户首页仪表板的样式
-
 ##### 更符合 GitHub 风格
 
-- 同步查看代码文件内容时的样式 (去掉了一些底部元素, 优化滚动体验)
+- 同步页脚样式
-- 整体调整了页面元素的间隔, 样式和字体大小
+- 优化创建标签菜单的菜单项的样式
-- 同步顶部工单/合并请求/里程碑下的仪表板样式
-- 同步里程碑/置顶 Issue 的样式
-- 同步通知/订阅/关注/软件包/提示框/用户头像菜单的页面样式
-- 同步分支菜单宽度
-- 同步仓库已标星的星星颜色
 
 ### 🐞 Fix
 
-- 修复红绿色盲主题的代码高亮色
+- 修复 Wiki 页面搜索项目没有正确隐藏的问题 #15
-- 修复仓库中文 README 时的按钮下划线长度
+- 修复后台账户管理排序菜单项的宽度问题
-- 修复登录二次验证页面内容位置
+- 修复合并提交中的主色调按钮组阴影问题
-- 修复后台管理的运维管理面板的样式
+- 修复仓库页面下二级导航栏下划线过粗的问题
-- 取消修改编辑器字体大小, 避免光标错位
-- 修复提交列表尾行圆角
-- 修复 Wiki 页面和二级导航栏组织下团队菜单的圆角问题
-- 修复创建工单页面样式
-- 修复归档仓库 Issue 时间线过长插入归档信息框
-- 修复亮色主题下的 PR 合并操作评论的头像和按钮图标颜色
-
-## 📃 English (From AI)
-
-### ✨ Feature
-
-- Added pink color theme
-- Modified theme names displayed in appearance settings
-
-#### CSS Variables
-
-- Added `--custom-branch-menu-width` variable for setting branch menu width
-- Added `--custom-user-menu-width` variable for setting user menu width
-
-### 🌈 Style
-
-- Optimized dashboard style on user homepage
-
-##### More GitHub-like style
-
-- Synced styles when viewing code file content (removed some bottom elements, optimized scrolling experience)
-- Adjusted spacing, styles, and font sizes of page elements overall
-- Synced dashboard styles under top issues/pull requests/milestones
-- Synced styles of milestones/pinned Issues
-- Synced page styles of notifications/subscriptions/follows/packages/tooltips/user avatar menus
-- Synced branch menu width
-- Synced star color for starred repositories
-
-### 🐞 Fix
-
-- Fixed code highlight colors for red-green color blindness theme
-- Fixed button underline length for Chinese README in repositories
-- Fixed content position on login two-factor authentication page
-- Fixed style of operation and maintenance management panel in admin backend
-- Reverted editor font size changes to avoid cursor misalignment
-- Fixed rounded corners of last row in commit list
-- Fixed rounded corners issue in Wiki pages and team menus under secondary navigation bar organization
-- Fixed style of issue creation page
-- Fixed issue where archive information box is inserted when issue timeline is too long in archived repositories
-- Fixed avatar and button icon colors in PR merge operation comments under light theme

README.md

@@ -5,6 +5,11 @@
 
 # Gitea GitHub Theme
 
+> [!TIP]
+>
+> 推荐搭配 Catppuccin 文件图标浏览器插件一起使用更佳
+> [web-file-explorer-icons](https://github.com/catppuccin/web-file-explorer-icons)
+
 ## 版本号说明
 
 主题版本号与 Gitea 版本号保持一致
@@ -30,11 +35,6 @@ Gitea 理论上小版本号变更不会修改前端布局, 所以主题的小版
 >
 > 自动颜色主题需要亮色和暗色的主题文件
 
-> [!TIP]
->
-> 推荐搭配 Catppuccin 文件图标浏览器插件一起使用更佳
-> [github-file-explorer-icons](https://github.com/catppuccin/github-file-explorer-icons)
-
 例: 主题文件名为 `theme-github-dark.css`，则添加 `github-dark` 到 `THEMES` 末尾
 
 `gitea/conf/app.ini` 例:

README_EN.md

@@ -5,6 +5,11 @@
 
 # Gitea GitHub Theme
 
+> [!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
@@ -33,11 +38,6 @@ accepted.
 >
 > Automatic color theme requires both light and dark theme files.
 
-> [!TIP]
->
-> Recommend using Catppuccin file icon browser plugin together for better performance.
-> [github-file-explorer-icons](https://github.com/catppuccin/github-file-explorer-icons)
-
 Example: If the theme filename is `theme-github-dark.css`, add `github-dark` to the end of `THEMES`
 
 Example `gitea/conf/app.ini`:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "gitea-github-theme",
-  "version": "1.24.6",
+  "version": "1.24.7",
   "type": "module",
   "scripts": {
     "dev": "vite build --mode dev",

src/core/display.ts

@@ -54,7 +54,7 @@ export function display2GithubColor(
         bgColor: {
           ...baseGithubColor.button.primary.bgColor,
           rest: soft ? saturate(-0.1, scaleColorLight(displayColor.num5, -2)) : displayColor.num5,
-          hover: soft ? saturate(-0.1, scaleColorLight(displayColor.num5, -7)) : scaleColorLight(displayColor.num5, 5),
+          hover: soft ? saturate(-0.1, scaleColorLight(displayColor.num5, 3)) : scaleColorLight(displayColor.num5, 5),
         },
       },
       star: {

styles/components/footer.ts

@@ -0,0 +1,43 @@
+import { css, themeVars } from "src/types/vars";
+
+export const footer = css`
+  .page-footer {
+    background-color: ${themeVars.color.body};
+    border-top: 0;
+    color: ${themeVars.color.text.light.num1};
+    font-size: 12px;
+    gap: 32px;
+    justify-content: center;
+    padding: 16px 0 40px 0;
+    > .left-links {
+      gap: 4px;
+      > a {
+        color: ${themeVars.color.text.light.num1};
+        &:hover {
+          color: ${themeVars.color.primary.self};
+        }
+      }
+      > strong {
+        font-weight: 400;
+      }
+    }
+    > .right-links {
+      gap: 16px;
+      > .ui.dropdown {
+        font-size: 12px;
+        &:hover {
+          color: ${themeVars.color.primary.self};
+        }
+      }
+      > a {
+        border-left: 0;
+        color: ${themeVars.color.text.light.num1};
+        padding-left: 0;
+        margin-left: 0;
+        &:hover {
+          color: ${themeVars.color.primary.self};
+        }
+      }
+    }
+  }
+`;

styles/components/index.ts

@@ -7,9 +7,11 @@ import "./diff";
 import "./editor";
 import "./explore";
 import "./filelist";
+import "./footer";
 import "./heatmap";
 import "./issue";
 import "./milestones";
+import "./navbar";
 import "./newrepo";
 import "./notification";
 import "./org";

styles/public/button.ts

@@ -39,6 +39,14 @@ export const baseButton = css`
         ${primaryHoverStyle}
       }
     }
+    // 按钮组整体有阴影
+    &.buttons {
+      box-shadow: ${themeVars.github.shadow.resting.small};
+      .button {
+        // 按钮组里的按钮无阴影
+        box-shadow: none;
+      }
+    }
   }
   // 主色调基本按钮和普通按钮一样
   // 作者的关注按钮

styles/public/dropdown.ts

@@ -19,6 +19,7 @@ export const dropdown = css`
         align-items: center;
         padding: 6px 8px !important;
         border-radius: ${otherThemeVars.border.radius} !important;
+        gap: 4px;
         &:not(.emoji) {
           margin: 0 8px;
         }
@@ -48,12 +49,30 @@ export const dropdown = css`
         }
         svg {
           margin-top: 2px;
-          margin-right: 8px;
+          margin-right: 4px;
         }
         // 复选框对齐
         .ui.checkbox input[type="checkbox"] {
           height: 100%;
         }
+        // 修复 Wiki 页面下搜索框中搜索时, 显示隐藏的项目
+        &.filtered {
+          display: none !important;
+        }
+      }
+      // 当筛选后, 让菜单提供边距, 因为无法确定保留的是菜单中哪个 item
+      // 不是所有菜单都提供边距方式, 原因为比如会导致分支菜单中的查看所有分支上间隔缺失, 这种方式单独为 Wiki 菜单做处理
+      // 有筛选(.filtered)且有筛选结果(.selected)时提供菜单边距, 没结果时提供会导致多余的菜单边框线
+      &:has(> .item.filtered):has(> .item.selected) {
+        padding: 8px 0px;
+        > .item {
+          &:first-of-type {
+            margin-top: 0;
+          }
+          &:last-of-type {
+            margin-bottom: 0;
+          }
+        }
       }
       > .divider {
         margin: 8px 0;
@@ -91,7 +110,7 @@ export const dropdown = css`
   .user-menu>.item,
   // Issue/PR 菜单
   .ui.menu .ui.dropdown.item .menu .item {
-    width: auto;
+    width: calc(100% - 16px); // 减去上方 item 的 margin 左右边距
   }
   // 去掉下拉菜单的边框线
   // 设置里的下拉菜单
@@ -191,6 +210,18 @@ export const selectionDropdown = css`
     border-top-left-radius: ${otherThemeVars.border.radius} !important;
     border-top-right-radius: ${otherThemeVars.border.radius} !important;
   }
+  // 工单标签菜单中的标签换行和颜色
+  // 标签页面的标签选择框
+  .page-content.repository.labels .ui.selection.dropdown.active,
+  // 创建仓库页面的标签选择框
+  .ui.search.selection.dropdown {
+    > .menu > .item {
+      flex-wrap: wrap;
+      > i {
+        color: ${themeVars.color.text.light.num1};
+      }
+    }
+  }
 `;
 
 export const fixSelectionDropdown = css`

styles/public/index.ts

@@ -12,6 +12,5 @@ import "./label"; // 标签
 import "./menu"; // 菜单
 import "./modal"; // 弹窗
 import "./tippy"; // 提示框
-import "./navbar"; // 导航栏
 import "./attached"; // 附加样式
 import "./other"; // 其他样式

styles/public/menu.ts

@@ -193,6 +193,10 @@ export const secondaryMenu = css`
       }
     }
   }
+  // 修复仓库页面下的二级导航栏的下划线因浏览器 BUG 导致显示的异常问题(导致下划线和分割线重叠变粗)
+  .page-content.repository .ui.secondary.pointing.menu {
+    border-bottom: none !important;
+  }
 `;
 
 // 分页菜单