From 12d5636fb7ba9b2590a6f976e3e55a4d70ba2254 Mon Sep 17 00:00:00 2001
From: lutinglt <lutinglt@users.noreply.github.com>
Date: Wed, 13 Aug 2025 22:03:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=90=8C=E6=AD=A5=E6=9F=A5=E7=9C=8B=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81=E6=96=87=E4=BB=B6=E9=A1=B5=E9=9D=A2=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .github/release.md            |  1 +
 styles/components/filelist.ts | 73 ++++++++++++++++++++++++++++++++++-
 2 files changed, 73 insertions(+), 1 deletion(-)

diff --git a/.github/release.md b/.github/release.md
index 3cdce84..ffc8eb4 100644
--- a/.github/release.md
+++ b/.github/release.md
@@ -9,6 +9,7 @@
 #### 更符合 GitHub 风格
 
 - 同步代码编辑器背景色和字体大小 (修复亮色模式下编辑器背景色问题) #12
+- 同步查看代码文件页面样式 (包括滚动时固定的导航栏, 尽量与 GitHub 一致)
 - 同步分页菜单样式
 - 同步登录/注册页面样式
 - 同步 Issue/PR 列表样式
diff --git a/styles/components/filelist.ts b/styles/components/filelist.ts
index d1d7954..84c784b 100644
--- a/styles/components/filelist.ts
+++ b/styles/components/filelist.ts
@@ -147,12 +147,65 @@ export const repoFilesMobile = css`
 // 仓库打开文件时的视图
 export const repoFileView = css`
   .page-content.repository.file.list {
+    > .ui.container.fluid {
+      max-width: calc(100% - calc(2 * 16px));
+    }
     .repo-view-container {
+      // 左侧文件树
+      .repo-view-file-tree-container {
+        position: sticky;
+        top: 0;
+        &:after {
+          content: "";
+          position: absolute;
+          top: -14px;
+          right: 0;
+          width: 1px;
+          height: calc(100% + 14px);
+          background: ${themeVars.color.secondary.self};
+        }
+        > .repo-button-row {
+          height: 32px;
+          margin: 16px 0;
+          &:after {
+            content: "";
+            position: absolute;
+            top: 32px + 32px;
+            left: -16px;
+            width: calc(100% + 16px);
+            height: 1px;
+            background: ${themeVars.color.secondary.self};
+          }
+        }
+      }
       // 右侧文件视图内容
       .repo-view-content {
+        .repo-button-row {
+          align-items: center;
+          background: ${themeVars.color.box.header};
+          border: 1px solid ${themeVars.color.secondary.self};
+          border-radius: ${otherThemeVars.border.radius};
+          height: 46px;
+          min-height: 46px;
+          padding: 8px;
+          position: sticky;
+          top: 0;
+          z-index: 1;
+        }
+        .non-diff-file-content {
+          // 避免分支菜单遮挡
+          position: relative;
+          z-index: 0;
+          h4.file-header {
+            position: sticky;
+            top: 46px;
+            z-index: 1;
+          }
+        }
         // 头部提交信息
-        #repo-file-commit-box {
+        .ui.segment#repo-file-commit-box {
           padding: 8px 12px;
+          margin-bottom: 8px !important;
           > .latest-commit {
             gap: 8px;
           }
@@ -167,6 +220,24 @@ export const repoFileView = css`
   }
 `;
 
+// 避免手机/平板下路径容器过长导致换行, 取消固定
+export const repoFileViewMobile = css`
+  @media (max-width: 1023.98px) {
+    .page-content.repository.file.list .repo-view-container .repo-view-content {
+      .repo-button-row {
+        height: auto;
+        position: static;
+        z-index: 0;
+      }
+      .non-diff-file-content {
+        h4.file-header {
+          top: 0;
+        }
+      }
+    }
+  }
+`;
+
 // 仓库代码布局调整, 侧边栏宽度调整
 export const repoGrid = css`
   .repo-grid-filelist-sidebar {