From 1f321e6bdd74ae8d80a052e664ea91d4e5342e05 Mon Sep 17 00:00:00 2001
From: User <user@example.com>
Date: Thu, 25 Sep 2025 14:02:34 +0800
Subject: [PATCH] banana v3

---
 styles/components/clone.ts     |  7 +++-
 styles/components/commit.ts    | 15 +++++---
 styles/components/dashboard.ts | 18 ++++++---
 styles/components/diff.ts      |  3 +-
 styles/components/filelist.ts  | 21 +++++++----
 styles/components/footer.ts    |  9 +++--
 styles/components/heatmap.ts   | 22 +++++------
 styles/components/issue.ts     | 68 ++++++++++++++++++++++------------
 styles/components/navbar.ts    | 15 +++++---
 styles/components/repo.ts      | 18 ++++++---
 styles/public/button.ts        | 24 ++++++++----
 styles/public/dropdown.ts      | 12 ++++--
 styles/public/input.ts         |  3 +-
 styles/public/label.ts         | 57 ++++++++++++++++++----------
 styles/public/menu.ts          | 42 +++++++++++++--------
 styles/public/modal.ts         |  3 +-
 styles/public/other.ts         |  3 +-
 styles/public/tippy.ts         |  6 ++-
 themes/modern-light.css.ts     | 14 +++----
 19 files changed, 233 insertions(+), 127 deletions(-)

diff --git a/styles/components/clone.ts b/styles/components/clone.ts
index 8d5557d..6ae9a87 100644
--- a/styles/components/clone.ts
+++ b/styles/components/clone.ts
@@ -33,7 +33,8 @@ export const clone = css`
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
           &.active:after {
             content: "";
@@ -89,6 +90,7 @@ export const clone = css`
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
             background-color: ${themeVars.github.control.transparent.bgColor.hover};
+            position: relative;
             transform: scale(1.05); // 轻微放大效果
           }
           svg {
@@ -121,7 +123,8 @@ export const clone = css`
             color: ${themeVars.color.text.self};
             text-decoration: none;
             background: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateX(2px); // 轻微右移效果
+            position: relative;
+            left: 2px;
           }
         }
         > .item:hover {
diff --git a/styles/components/commit.ts b/styles/components/commit.ts
index b895e68..e0a9ab2 100644
--- a/styles/components/commit.ts
+++ b/styles/components/commit.ts
@@ -34,7 +34,8 @@ export const commit = css`
           &:hover {
             background-color: ${themeVars.github.bgColor.accent.emphasis};
             color: ${themeVars.color.white};
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
       }
@@ -48,7 +49,8 @@ export const commit = css`
           font-weight: 500; // 增加字体粗细
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
       }
@@ -66,7 +68,8 @@ export const commit = css`
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
             background-color: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
       }
@@ -75,7 +78,8 @@ export const commit = css`
         // 整行悬停色
         &:hover {
           background-color: ${themeVars.color.hover.opaque};
-          transform: translateX(2px); // 轻微右移效果
+          position: relative;
+          left: 2px;
         }
         // 偶数行悬停色
         &:nth-child(2n):hover {
@@ -126,7 +130,8 @@ export const commitStatus = css`
     transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
     &:hover {
       background-color: ${themeVars.github.control.transparent.bgColor.hover};
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
   
diff --git a/styles/components/dashboard.ts b/styles/components/dashboard.ts
index ff9552a..31380e2 100644
--- a/styles/components/dashboard.ts
+++ b/styles/components/dashboard.ts
@@ -20,7 +20,8 @@ export const dashboard = css`
           background: ${themeVars.color.menu};
           box-shadow: ${themeVars.github.shadow.floating.small};
           font-weight: 600;
-          transform: translateY(-1px); // 轻微上移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateY(-1px); // 轻微上移效果
         }
         &::before {
           display: none;
@@ -31,7 +32,8 @@ export const dashboard = css`
           width: calc(50% - 8px); // 调整宽度
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
       }
@@ -73,7 +75,8 @@ export const dashboard = css`
             }
             &:hover {
               background: ${themeVars.github.control.transparent.bgColor.hover};
-              transform: translateX(2px); // 轻微右移效果
+              position: relative;
+              left: 2px;
             }
             a.muted:hover {
               color: inherit;
@@ -119,7 +122,8 @@ export const dashboardIssues = css`
           }
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover} !important;
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
           &.active {
             color: ${themeVars.color.text.self};
@@ -138,7 +142,8 @@ export const dashboardIssues = css`
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
       }
@@ -183,7 +188,8 @@ export const fixOrgLabel = css`
     font-weight: 500; // 增加字体粗细
     transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
     &:hover {
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
 `;
\ No newline at end of file
diff --git a/styles/components/diff.ts b/styles/components/diff.ts
index 8992fbf..099569c 100644
--- a/styles/components/diff.ts
+++ b/styles/components/diff.ts
@@ -40,7 +40,8 @@ export const diff = css`
     &:hover {
       background: ${themeVars.github.bgColor.accent.emphasis};
       color: ${themeVars.color.white};
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
     &:active {
       animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1); // 点击脉冲效果
diff --git a/styles/components/filelist.ts b/styles/components/filelist.ts
index a24dc3b..b50eefb 100644
--- a/styles/components/filelist.ts
+++ b/styles/components/filelist.ts
@@ -16,7 +16,8 @@ export const branchButton = css`
         font-weight: 500; // 增加字体粗细
         transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
         &:hover {
-          transform: translateY(-1px); // 轻微上移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateY(-1px); // 轻微上移效果
         }
       }
     }
@@ -38,7 +39,8 @@ export const syncFork = css`
         font-weight: 500; // 增加字体粗细
         transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
         &:hover {
-          transform: translateY(-1px); // 轻微上移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateY(-1px); // 轻微上移效果
         }
       }
     }
@@ -250,7 +252,8 @@ export const repoFileView = css`
             border-radius: 8px; // 增加圆角
             transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
             &:hover {
-              transform: translateY(-1px); // 轻微上移效果
+              position: relative;
+              top: -1px;
             }
           }
         }
@@ -281,7 +284,8 @@ export const repoFileView = css`
             font-weight: 500; // 增加字体粗细
             transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
             &:hover {
-              transform: translateY(-1px); // 轻微上移效果
+              position: relative;
+              top: -1px;
             }
           }
           // 打开文件树按钮
@@ -342,7 +346,8 @@ export const repoFileView = css`
                   border-radius: 8px; // 增加圆角
                   transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
                   &:hover {
-                    transform: translateY(-1px); // 轻微上移效果
+                    position: relative;
+                    top: -1px;
                   }
                 }
               }
@@ -370,7 +375,8 @@ export const repoFileView = css`
                 &:hover {
                   background: ${themeVars.color.hover.self};
                   color: ${themeVars.color.text.light.num1};
-                  transform: translateY(-1px); // 轻微上移效果
+                  position: relative;
+                  top: -1px;
                 }
               }
             }
@@ -507,7 +513,8 @@ export const repoSidebarBottom = css`
         transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
         &:hover {
           background-color: ${themeVars.color.hover.opaque};
-          transform: translateY(-1px); // 轻微上移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateY(-1px); // 轻微上移效果
         }
         .flex-item {
           padding: 16px 0 0 0;
diff --git a/styles/components/footer.ts b/styles/components/footer.ts
index d34d52b..0c008d4 100644
--- a/styles/components/footer.ts
+++ b/styles/components/footer.ts
@@ -22,7 +22,8 @@ export const footer = css`
         &:hover {
           color: ${themeVars.color.primary.self};
           background-color: ${themeVars.color.hover.self};
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
       > strong {
@@ -39,7 +40,8 @@ export const footer = css`
         &:hover {
           color: ${themeVars.color.primary.self};
           background-color: ${themeVars.color.hover.self};
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
       > a {
@@ -52,7 +54,8 @@ export const footer = css`
         &:hover {
           color: ${themeVars.color.primary.self};
           background-color: ${themeVars.color.hover.self};
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
     }
diff --git a/styles/components/heatmap.ts b/styles/components/heatmap.ts
index 555b08f..1c37200 100644
--- a/styles/components/heatmap.ts
+++ b/styles/components/heatmap.ts
@@ -38,7 +38,7 @@ export const heatmap = css`
         // 悬停效果
         &:hover {
           outline: 2px solid ${themeVars.color.primary.self}; // 添加主色调边框
-          z-index: 10; // 确保悬停时在最上层
+          position: relative; // 使用相对定位而不是 z-index
         }
 
         &[style="fill: var(--color-secondary-alpha-60);"] {
@@ -46,28 +46,28 @@ export const heatmap = css`
         }
 
         &[style="fill: var(--color-primary-light-4);"] {
-          fill: ${themeVars.github.contribution.default.bgColor.num1} !important;
-          outline-color: ${themeVars.github.contribution.default.borderColor.num1};
+          fill: ${themeVars.color.primary.light.num4} !important;
+          outline-color: ${themeVars.github.contribution.default.borderColor.num0};
         }
 
         &[style="fill: var(--color-primary-light-2);"] {
-          fill: ${themeVars.github.contribution.default.bgColor.num2} !important;
-          outline-color: ${themeVars.github.contribution.default.borderColor.num2};
+          fill: ${themeVars.color.primary.light.num2} !important;
+          outline-color: ${themeVars.github.contribution.default.borderColor.num0};
         }
 
         &[style="fill: var(--color-primary);"] {
-          fill: ${themeVars.github.contribution.default.bgColor.num3} !important;
-          outline-color: ${themeVars.github.contribution.default.borderColor.num3};
+          fill: ${themeVars.color.primary.self} !important;
+          outline-color: ${themeVars.github.contribution.default.borderColor.num0};
         }
 
         &[style="fill: var(--color-primary-dark-2);"] {
-          fill: ${themeVars.github.contribution.default.bgColor.num4} !important;
-          outline-color: ${themeVars.github.contribution.default.borderColor.num4};
+          fill: ${themeVars.color.primary.dark.num2} !important;
+          outline-color: ${themeVars.github.contribution.default.borderColor.num0};
         }
 
         &[style="fill: var(--color-primary-dark-4);"] {
-          fill: ${themeVars.github.contribution.default.bgColor.num5} !important;
-          outline-color: ${themeVars.github.contribution.default.borderColor.num5};
+          fill: ${themeVars.color.primary.dark.num4} !important;
+          outline-color: ${themeVars.github.contribution.default.borderColor.num0};
         }
       }
     }
diff --git a/styles/components/issue.ts b/styles/components/issue.ts
index 14e4852..f0b383a 100644
--- a/styles/components/issue.ts
+++ b/styles/components/issue.ts
@@ -41,7 +41,8 @@ export const issueList = css`
             }
             &:hover {
               background: ${themeVars.github.control.transparent.bgColor.hover} !important;
-              transform: translateY(-1px); // 轻微上移效果
+              position: relative;
+              top: -1px;
             }
             &.active {
               color: ${themeVars.color.text.self};
@@ -63,7 +64,8 @@ export const issueList = css`
           font-weight: 500; // 增加字体粗细
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
       }
@@ -91,7 +93,8 @@ export const issueList = css`
         }
         &:hover {
           background-color: ${themeVars.color.hover.opaque};
-          transform: translateX(2px); // 轻微右移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateX(2px); // 轻微右移效果
         }
         > .flex-item-icon {
           display: flex;
@@ -134,7 +137,8 @@ export const issueList = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background-color: ${themeVars.color.hover.opaque};
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
       .milestone-header {
         h3 {
@@ -195,7 +199,8 @@ export const issuePins = css`
       box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); // 添加阴影
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
-        transform: translateY(-2px); // 轻微上移效果
+        position: relative;
+        top: -2px;
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); // 增强阴影
       }
       .content {
@@ -233,7 +238,8 @@ export const button = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background-color: ${themeVars.color.hover.self};
-        transform: translateY(-1px); // 轻微上移效果
+        // 移除 transform 以避免创建新的层叠上下文
+        // transform: translateY(-1px); // 轻微上移效果
       }
       &:active {
         animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1); // 点击脉冲效果
@@ -248,7 +254,8 @@ export const button = css`
       font-weight: 500; // 增加字体粗细
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
-        transform: translateY(-1px); // 轻微上移效果
+        // 移除 transform 以避免创建新的层叠上下文
+        // transform: translateY(-1px); // 轻微上移效果
       }
       &:active {
         animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1); // 点击脉冲效果
@@ -263,7 +270,8 @@ export const button = css`
     font-weight: 500; // 增加字体粗细
     transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
     &:hover {
-      transform: translateY(-1px); // 轻微上移效果
+      // 移除 transform 以避免创建新的层叠上下文
+      // transform: translateY(-1px); // 轻微上移效果
     }
     &:active {
       animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1); // 点击脉冲效果
@@ -304,7 +312,8 @@ export const babel = css`
       border-color: ${themeVars.github.bgColor.success.emphasis} !important;
       &:hover {
         opacity: 0.9; // 悬停时降低不透明度
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
 
@@ -314,7 +323,8 @@ export const babel = css`
       border-color: ${themeVars.github.bgColor.done.emphasis} !important;
       &:hover {
         opacity: 0.9; // 悬停时降低不透明度
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
 
@@ -324,7 +334,8 @@ export const babel = css`
       border-color: ${themeVars.github.bgColor.done.emphasis} !important;
       &:hover {
         opacity: 0.9; // 悬停时降低不透明度
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
   }
@@ -345,7 +356,8 @@ export const prBranch = css`
     &:hover {
       background-color: ${themeVars.github.bgColor.accent.emphasis};
       color: ${themeVars.color.white};
-      transform: translateY(-1px); // 轻微上移效果
+      // 移除 transform 以避免创建新的层叠上下文
+      // transform: translateY(-1px); // 轻微上移效果
     }
   }
 
@@ -394,7 +406,8 @@ export const comment = css`
         border-radius: 25px; // 增加圆角
         transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
         &:hover {
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
       // 隐藏顶部菜单的表情按钮
@@ -414,9 +427,9 @@ export const comment = css`
           border-radius: 8px; // 增加圆角
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
-            background-color: ${themeVars.color.red.badge.bg} !important;
             color: ${themeVars.color.red.light};
-            transform: translateX(2px); // 轻微右移效果
+            position: relative;
+            left: 2px;
           }
         }
       }
@@ -436,7 +449,8 @@ export const comment = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background: ${themeVars.color.hover.self};
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
     // 底部表情栏
@@ -450,7 +464,8 @@ export const comment = css`
         &:hover {
           background-color: ${themeVars.color.reaction.hoverBg} !important;
           border-color: ${themeVars.color.light.border};
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
         .reaction {
           font-size: 12px;
@@ -498,7 +513,8 @@ export const dropdown = css`
         border-radius: 8px; // 增加圆角
         transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
         &:hover {
-          transform: translateX(2px); // 轻微右移效果
+          position: relative;
+          left: 2px;
         }
       }
     }
@@ -552,6 +568,7 @@ export const prMerge = css`
         }
       }
       &:hover {
+        position: relative;
         transform: scale(1.05); // 轻微放大效果
       }
     }
@@ -586,7 +603,8 @@ export const prMerge = css`
           }
           &:hover {
             background-color: ${themeVars.color.hover.opaque};
-            transform: translateX(2px); // 轻微右移效果
+            position: relative;
+            left: 2px;
           }
         }
       }
@@ -721,7 +739,8 @@ export const issueSidebar = css`
             transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
             &:hover {
               background: ${themeVars.github.control.transparent.bgColor.hover};
-              transform: translateY(-1px); // 轻微上移效果
+              position: relative;
+              top: -1px;
             }
           }
           .ui.list {
@@ -739,7 +758,8 @@ export const issueSidebar = css`
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         // 选中日期颜色
@@ -760,7 +780,8 @@ export const issueSidebar = css`
             margin: 0 !important;
           }
           &:hover {
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         // PIN 按钮
@@ -778,7 +799,8 @@ export const issueSidebar = css`
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateX(2px); // 轻微右移效果
+            position: relative;
+            left: 2px;
           }
         }
         .ui.show-modal.button[data-modal="#sidebar-delete-issue"] {
diff --git a/styles/components/navbar.ts b/styles/components/navbar.ts
index 7ad254e..971338f 100644
--- a/styles/components/navbar.ts
+++ b/styles/components/navbar.ts
@@ -32,7 +32,8 @@ export const navbarRight = css`
         }
         &:hover:not(#navbar-logo) {
           background-color: ${themeVars.color.nav.hoverBg};
-          transform: translateY(-1px); // 轻微上移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateY(-1px); // 轻微上移效果
         }
       }
     }
@@ -79,12 +80,14 @@ export const navbarRight = css`
           }
           &:hover {
             background-color: ${themeVars.color.nav.hoverBg};
-            transform: translateY(-1px); // 轻微上移效果
+            // 移除 transform 以避免创建新的层叠上下文
+            // transform: translateY(-1px); // 轻微上移效果
           }
         }
         &:hover:not(.ui.dropdown) {
           background-color: ${themeVars.color.nav.hoverBg};
-          transform: translateY(-1px); // 轻微上移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateY(-1px); // 轻微上移效果
         }
       }
       .item.ui.dropdown {
@@ -105,7 +108,8 @@ export const navbarRight = css`
               width: 36px; // 增加宽度
               transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
               &:hover {
-                transform: scale(1.05); // 轻微放大效果
+                // 移除 transform 以避免创建新的层叠上下文
+                // transform: scale(1.05); // 轻微放大效果
               }
             }
           }
@@ -220,7 +224,8 @@ export const secondaryNav = css`
         }
         &:hover {
           background-color: ${themeVars.color.hover.self};
-          transform: translateY(-1px); // 轻微上移效果
+          // 移除 transform 以避免创建新的层叠上下文
+          // transform: translateY(-1px); // 轻微上移效果
         }
         &.active {
           background-color: ${themeVars.color.active};
diff --git a/styles/components/repo.ts b/styles/components/repo.ts
index dfbc3ab..70d80b3 100644
--- a/styles/components/repo.ts
+++ b/styles/components/repo.ts
@@ -10,7 +10,8 @@ export const repoHeader = css`
       font-weight: 500; // 增加字体粗细
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
-        transform: translateY(-1px); // 轻微上移效果
+        // 移除 transform 以避免创建新的层叠上下文
+        // transform: translateY(-1px); // 轻微上移效果
       }
       &:active {
         animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1); // 点击脉冲效果
@@ -37,7 +38,8 @@ export const repoHeader = css`
           transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateX(2px); // 轻微右移效果
+            position: relative;
+            left: 2px;
           }
           &.muted:not(.tw-font-normal) {
             font-weight: 600;
@@ -79,12 +81,14 @@ export const repoMenu = css`
             color: ${themeVars.color.text.light.num1};
           }
           &:hover {
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         &:hover:not(.active) {
           background-color: ${themeVars.github.control.transparent.bgColor.hover};
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
     }
@@ -107,7 +111,8 @@ export const repoTopic = css`
     &:hover {
       background-color: ${themeVars.github.bgColor.accent.emphasis};
       color: ${themeVars.color.white};
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
 `;
@@ -120,7 +125,8 @@ export const closedIssueTableCell = css`
     transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
     &:hover {
       opacity: 0.9; // 悬停时降低不透明度
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
 `;
\ No newline at end of file
diff --git a/styles/public/button.ts b/styles/public/button.ts
index 50896be..42b2455 100644
--- a/styles/public/button.ts
+++ b/styles/public/button.ts
@@ -12,7 +12,8 @@ export const primaryHoverStyle = {
   color: themeVars.github.button.primary.fgColor.rest,
   backgroundColor: themeVars.github.button.primary.bgColor.hover,
   borderColor: themeVars.github.button.primary.borderColor.hover,
-  transform: "translateY(-1px)", // 添加轻微的上移效果
+  // 移除 transform 以避免创建新的层叠上下文
+  // transform: "translateY(-1px)", // 添加轻微的上移效果
   boxShadow: `0 4px 12px rgba(0, 0, 0, 0.1), ${themeVars.github.shadow.resting.small}`, // 增强阴影
 };
 
@@ -48,7 +49,8 @@ export const baseButton = css`
         ${primaryHoverStyle}
       }
       &:active {
-        transform: translateY(0); // 点击时回到原位
+        // 移除 transform 以避免创建新的层叠上下文
+        // transform: translateY(0); // 点击时回到原位
       }
     }
     // 按钮组整体有阴影
@@ -72,11 +74,13 @@ export const baseButton = css`
       background-color: ${themeVars.color.hover.self};
       color: ${themeVars.color.text.self};
       border-color: ${themeVars.color.light.border};
-      transform: translateY(-1px); // 添加轻微的上移效果
+      position: relative;
+      top: -1px;
       box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); // 添加阴影
     }
     &:active {
-      transform: translateY(0); // 点击时回到原位
+      // 移除 transform 以避免创建新的层叠上下文
+      // transform: translateY(0); // 点击时回到原位
       animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1);
     }
   }
@@ -87,11 +91,13 @@ export const baseButton = css`
     border-radius: 8px; // 增加圆角
     &:hover {
       border-color: ${themeVars.color.light.border};
-      transform: translateY(-1px); // 添加轻微的上移效果
+      position: relative;
+      top: -1px;
       box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); // 添加阴影
     }
     &:active {
-      transform: translateY(0); // 点击时回到原位
+      // 移除 transform 以避免创建新的层叠上下文
+      // transform: translateY(0); // 点击时回到原位
       animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1);
     }
   }
@@ -124,11 +130,13 @@ export const redButton = css`
       background-color: ${themeVars.github.button.danger.bgColor.hover};
       border-color: ${themeVars.github.button.danger.borderColor.hover};
       box-shadow: ${themeVars.github.shadow.resting.small};
-      transform: translateY(-1px); // 添加轻微的上移效果
+      position: relative;
+      top: -1px;
     }
     
     &:active {
-      transform: translateY(0); // 点击时回到原位
+      // 移除 transform 以避免创建新的层叠上下文
+      // transform: translateY(0); // 点击时回到原位
       animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1);
     }
   }
diff --git a/styles/public/dropdown.ts b/styles/public/dropdown.ts
index b1055df..9dfe2c1 100644
--- a/styles/public/dropdown.ts
+++ b/styles/public/dropdown.ts
@@ -34,7 +34,10 @@ export const dropdown = css`
         }
         &:hover {
           background-color: ${themeVars.github.control.transparent.bgColor.hover} !important;
-          transform: translateX(2px); // 轻微右移效果
+          position: relative;
+          left: 2px;
+          // 使用 margin-left 代替 transform 来实现右移效果
+          margin-left: 2px;
         }
         &.selected {
           background-color: ${themeVars.color.active} !important;
@@ -160,7 +163,8 @@ export const selectionDropdown = css`
     &:hover {
       background: ${themeVars.color.hover.self};
       border-color: ${themeVars.github.borderColor.accent.emphasis}; // 悬停时改变边框色
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
     // 悬停提供伪元素
     .item:hover:after {
@@ -190,7 +194,8 @@ export const selectionDropdown = css`
     &:hover {
       background: ${themeVars.color.hover.self};
       border-color: ${themeVars.github.borderColor.accent.emphasis}; // 悬停时改变边框色
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
   // 选择输入框效果和输入框 focus 效果一样
@@ -283,6 +288,7 @@ export const emojiDropdown = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background-color: ${themeVars.github.bgColor.accent.emphasis} !important;
+        position: relative;
         transform: scale(1.1); // 轻微放大效果
       }
     }
diff --git a/styles/public/input.ts b/styles/public/input.ts
index f649f95..6ceab8b 100644
--- a/styles/public/input.ts
+++ b/styles/public/input.ts
@@ -31,7 +31,8 @@ export const input = css`
       // 向内部添加一个 1px 的边框
       box-shadow: inset 0 0 0 1px ${themeVars.github.borderColor.accent.emphasis}, 0 0 0 3px rgba(253, 224, 71, 0.2); // 增强焦点效果
       outline: none;
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
     &:hover:not(:focus) {
       border-color: ${themeVars.github.borderColor.accent.emphasis}; // 悬停时改变边框色
diff --git a/styles/public/label.ts b/styles/public/label.ts
index 94d3d20..d9b90ae 100644
--- a/styles/public/label.ts
+++ b/styles/public/label.ts
@@ -32,7 +32,8 @@ export const label = css`
           color: ${themeVars.color.primary.self};
           &:hover {
             background-color: ${themeVars.color.primary.dark.num1}; // 悬停时添加背景色
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         /* 红色标签 */
@@ -42,7 +43,8 @@ export const label = css`
           color: ${themeVars.color.purple.self};
           &:hover {
             background-color: ${themeVars.color.purple.dark.num1}; // 悬停时添加背景色
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         /* 橙色标签 */
@@ -52,7 +54,8 @@ export const label = css`
           color: ${themeVars.color.yellow.self};
           &:hover {
             background-color: ${themeVars.color.yellow.dark.num1}; // 悬停时添加背景色
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         /* 黄色标签 */
@@ -62,7 +65,8 @@ export const label = css`
           color: ${themeVars.color.orange.self};
           &:hover {
             background-color: ${themeVars.color.orange.dark.num1}; // 悬停时添加背景色
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         /* 黄绿色标签 */
@@ -72,7 +76,8 @@ export const label = css`
           color: ${themeVars.color.olive.self};
           &:hover {
             background-color: ${themeVars.color.olive.dark.num1}; // 悬停时添加背景色
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         /* 绿色标签 */
@@ -82,7 +87,8 @@ export const label = css`
           color: ${themeVars.color.green.self};
           &:hover {
             background-color: ${themeVars.color.green.dark.num1}; // 悬停时添加背景色
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         /* 紫色标签 */
@@ -92,13 +98,15 @@ export const label = css`
           color: ${themeVars.color.purple.self};
           &:hover {
             background-color: ${themeVars.color.purple.dark.num1}; // 悬停时添加背景色
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
         // 添加悬停效果
         &:hover:not(.primary):not(.red):not(.orange):not(.yellow):not(.olive):not(.green):not(.purple) {
           background-color: ${themeVars.color.hover.self}; // 悬停时添加背景色
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
     }
@@ -127,7 +135,8 @@ export const shaLabel = css`
     transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
     &:hover {
       background-color: ${themeVars.color.label.hoverBg};
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
     // 验证提交 SHA 标签
     &.commit-is-signed {
@@ -135,7 +144,8 @@ export const shaLabel = css`
       background-color: unset !important;
       &:hover {
         background-color: ${themeVars.color.label.hoverBg} !important;
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
       span.ui.label.commit-is-signed {
         padding: 3px 5px;
@@ -154,7 +164,8 @@ export const shaLabel = css`
       color: ${themeVars.color.green.badge.self} !important;
       &:hover {
         background-color: ${themeVars.color.green.badge.bg} !important;
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
     // 验证未信任
@@ -163,7 +174,8 @@ export const shaLabel = css`
       color: ${themeVars.color.yellow.badge.self} !important;
       &:hover {
         background-color: ${themeVars.color.yellow.badge.bg} !important;
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
     // 验证未匹配
@@ -172,7 +184,8 @@ export const shaLabel = css`
       color: ${themeVars.color.orange.badge.self} !important;
       &:hover {
         background-color: ${themeVars.color.orange.badge.bg} !important;
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
     // 验证警告
@@ -181,7 +194,8 @@ export const shaLabel = css`
       color: ${themeVars.color.red.badge.self} !important;
       &:hover {
         background-color: ${themeVars.color.red.badge.bg} !important;
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
   }
@@ -199,7 +213,8 @@ export const taskStatusLabel = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background: ${themeVars.color.success.bg}; // 悬停时改变背景色
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
 
@@ -212,7 +227,8 @@ export const taskStatusLabel = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background: ${themeVars.color.error.bg.self}; // 悬停时改变背景色
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
 
@@ -226,7 +242,8 @@ export const taskStatusLabel = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background: ${themeVars.color.info.bg}; // 悬停时改变背景色
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
 
@@ -240,7 +257,8 @@ export const taskStatusLabel = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background: ${themeVars.color.warning.bg}; // 悬停时改变背景色
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
   }
@@ -261,7 +279,8 @@ export const repoLabel = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background-color: ${themeVars.color.hover.self}; // 悬停时添加背景色
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
   }
diff --git a/styles/public/menu.ts b/styles/public/menu.ts
index 69b0d57..2709253 100644
--- a/styles/public/menu.ts
+++ b/styles/public/menu.ts
@@ -27,10 +27,10 @@ export const verticalMenu = css`
       padding: 8px 12px; // 增加内边距
     }
     // 菜单项被悬停时的背景色, 限制a标签, 避免为子菜单多余渲染
-    a.item:hover {
+    &:hover {
       background: ${themeVars.github.control.transparent.bgColor.hover};
-      border-radius: 8px; // 增加圆角
-      transform: translateX(2px); // 轻微右移效果
+      position: relative;
+      top: -1px;
     }
     // 菜单项
     .item,
@@ -132,7 +132,8 @@ export const menu = css`
     transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
     &:hover {
       background: ${themeVars.github.control.transparent.bgColor.hover};
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
   // 一些水平小型菜单的颜色更改
@@ -141,7 +142,8 @@ export const menu = css`
     border-radius: 8px; // 增加圆角
     &:hover {
       background: ${themeVars.github.control.transparent.bgColor.hover} !important;
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
   // 一些菜单的悬浮色更改
@@ -154,7 +156,8 @@ export const menu = css`
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
         background: ${themeVars.github.control.transparent.bgColor.hover};
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
   }
@@ -172,7 +175,8 @@ export const secondaryMenu = css`
     }
     a.item:hover {
       background: ${themeVars.github.control.transparent.bgColor.hover};
-      transform: translateY(-1px); // 轻微上移效果
+      position: relative;
+      top: -1px;
     }
   }
   // 二级导航栏, 比如仓库的导航栏, 仓库列表的导航栏, 探索的类型导航栏
@@ -202,7 +206,8 @@ export const secondaryMenu = css`
         margin-right: 8px;
       }
       &:hover {
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
     }
     .active.item {
@@ -247,17 +252,19 @@ export const paginationMenu = css`
       padding: 5px 10px !important;
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &.active {
-        background: ${themeVars.github.bgColor.accent.emphasis};
-        color: ${themeVars.color.white};
-        transform: translateY(-1px); // 轻微上移效果
-      }
+          background: ${themeVars.github.bgColor.accent.emphasis};
+          color: ${themeVars.color.white};
+          position: relative;
+          top: -1px;
+        }
       // 设置透明边框线避免 hover 时元素大小变化
       &:not(.active) {
         border: 1px solid #ffffff00;
         &:hover {
           background: unset;
           border-color: ${themeVars.color.secondary.self};
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
       &.navigation {
@@ -272,7 +279,8 @@ export const paginationMenu = css`
           margin-top: 2px;
         }
         &:hover {
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
       }
     }
@@ -308,7 +316,8 @@ export const smallCompactMenu = css`
           background: ${themeVars.color.menu} !important;
           border-color: ${themeVars.color.light.border};
           font-weight: 600;
-          transform: translateY(-1px); // 轻微上移效果
+          position: relative;
+          top: -1px;
         }
         &::before {
           display: none;
@@ -328,7 +337,8 @@ export const smallCompactMenu = css`
           }
           &:hover {
             background: ${themeVars.github.control.transparent.bgColor.hover} !important;
-            transform: translateY(-1px); // 轻微上移效果
+            position: relative;
+            top: -1px;
           }
         }
       }
diff --git a/styles/public/modal.ts b/styles/public/modal.ts
index 40a8ca8..c793e2a 100644
--- a/styles/public/modal.ts
+++ b/styles/public/modal.ts
@@ -39,7 +39,8 @@ export const modal = css`
       font-weight: 500; // 增加字体粗细
       transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // 添加过渡效果
       &:hover {
-        transform: translateY(-1px); // 轻微上移效果
+        position: relative;
+        top: -1px;
       }
       &:active {
         animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1); // 点击脉冲效果
diff --git a/styles/public/other.ts b/styles/public/other.ts
index 3ffd19a..57f8449 100644
--- a/styles/public/other.ts
+++ b/styles/public/other.ts
@@ -33,7 +33,8 @@ export const card = css`
     
     &:hover {
       box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.05); // 悬停时增强阴影
-      transform: translateY(-2px); // 轻微上移效果
+      position: relative;
+      top: -2px;
     }
   }
   
diff --git a/styles/public/tippy.ts b/styles/public/tippy.ts
index 84392e1..4e7d418 100644
--- a/styles/public/tippy.ts
+++ b/styles/public/tippy.ts
@@ -16,7 +16,8 @@ export const tippyBox = css`
       border: unset;
       box-shadow: ${themeVars.github.shadow.floating.small};
       &:hover {
-        transform: translateY(-4px); // 增强上移效果
+        position: relative;
+        top: -4px;
         box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15), 0 6px 8px rgba(0, 0, 0, 0.1); // 增强阴影
       }
     }
@@ -45,7 +46,8 @@ export const tippyBox = css`
           font-weight: 500; // 增加字体粗细
           &:hover {
             background-color: ${themeVars.github.control.transparent.bgColor.hover};
-            transform: translateX(4px); // 增强右移效果
+            position: relative;
+            left: 4px;
             color: ${themeVars.color.primary.self}; // 改变文字颜色
           }
         }
diff --git a/themes/modern-light.css.ts b/themes/modern-light.css.ts
index 54d453f..8908d31 100644
--- a/themes/modern-light.css.ts
+++ b/themes/modern-light.css.ts
@@ -13,7 +13,7 @@ export const modernLightGithubColors: GithubColor = {
     brown: { fgColor: "#755f43" },
     cyan: { fgColor: "#006a80" },
     indigo: { fgColor: "#494edf" },
-    lemon: { fgColor: "#fde047" }, // 使用香蕉黄作为柠檬色
+    lemon: { fgColor: "#f3cb00ff" }, // 使用香蕉黄作为柠檬色
     olive: { fgColor: "#56682c" },
     teal: { fgColor: "#106e75" },
   },
@@ -25,7 +25,7 @@ export const modernLightGithubColors: GithubColor = {
     hunkNum: { bgColor: { rest: "#b6e3ff" } },
   },
   fgColor: {
-    accent: "#fde047", // 使用香蕉黄作为主色调
+    accent: "#f3cb00ff", // 使用香蕉黄作为主色调
     attention: "#9a6700",
     danger: "#d1242f",
     default: "#1f2328",
@@ -41,7 +41,7 @@ export const modernLightGithubColors: GithubColor = {
     onEmphasis: "#ffffff",
   },
   bgColor: {
-    accent: { emphasis: "#fde047", muted: "#fffbeb" }, // 使用香蕉黄作为强调色
+    accent: { emphasis: "#f3cb00ff", muted: "#fffbeb" }, // 使用香蕉黄作为强调色
     attention: { muted: "#fff8c5" },
     danger: { muted: "#ffebe9" },
     default: "#ffffff",
@@ -53,7 +53,7 @@ export const modernLightGithubColors: GithubColor = {
     inset: "#f6f8fa",
   },
   borderColor: {
-    accent: { emphasis: "#fde047" }, // 使用香蕉黄作为边框强调色
+    accent: { emphasis: "#f3cb00ff" }, // 使用香蕉黄作为边框强调色
     attention: { emphasis: "#9a6700" },
     default: "#d1d9e0",
     done: { emphasis: "#8250df" },
@@ -64,10 +64,10 @@ export const modernLightGithubColors: GithubColor = {
   button: {
     primary: {
       fgColor: { accent: "#1f2328", rest: "#1f2328" }, // 深色文字在黄色背景上
-      bgColor: { rest: "#fde047", hover: "#eab308" }, // 香蕉黄按钮
+      bgColor: { rest: "#f3cb00ff", hover: "#eab308" }, // 香蕉黄按钮
     },
     danger: { fgColor: { rest: "#d1242f", hover: "#ffffff" }, bgColor: { hover: "#cf222e" } },
-    star: { iconColor: "#fde047" }, // 使用香蕉黄作为星标颜色
+    star: { iconColor: "#f3cb00ff" }, // 使用香蕉黄作为星标颜色
   },
   control: {
     bgColor: { active: "#e6eaef", hover: "#eff2f5", rest: "#f6f8fa" },
@@ -75,7 +75,7 @@ export const modernLightGithubColors: GithubColor = {
   },
   shadow: { floating: { small: "#25292e0a" }, resting: { small: "#1f23280f" } },
   overlay: { backdrop: { bgColor: "#c8d1da66" } },
-  underlineNav: { borderColor: { active: "#fde047" }, // 使用香蕉黄作为导航下划线
+  underlineNav: { borderColor: { active: "#f3cb00ff" }, // 使用香蕉黄作为导航下划线
  },
   contribution: {
     default: {