动画迁移 & 部分 PR 样式 (#7)

* 弹窗动画

* 优化 PR 中的合并提交按钮颜色

* 优化按钮样式

* 同步 PR 的合并提交头像样式

* 同步 Issue/PR 的时间线样式

* Issue/PR 的时间线样式间隔和大小

* 同步 PR 的合并提交操作面板样式

* PR 操作间隔

* green

* PR 操作边框色

* 已合并颜色

* 仓库同步派生栏样式同步

* 动画迁移 & 一些圆角修复

* 修复工单下依赖工单选择框

* 评论标题颜色&分支字体&提交栏样式

---------

Co-authored-by: lutinglt <lutinglt@users.noreply.github.com>

styles/components/filelist.tsx

@@ -16,12 +16,15 @@ export const branchButton = css`
   }
 `;
 
-// 仓库按钮
-export const repoButton = css`
+// 仓库同步派生
+export const syncFork = css`
   .page-content.repository.file.list {
-    // clone 按钮调整
-    .repo-button-row .repo-button-row-right .ui.primary.button span {
-      margin: 0px 3px;
+    .repo-home-filelist > .ui.message {
+      background: ${themeVars.color.box.header};
+      padding: 8px 8px 8px 16px;
+      .ui.button {
+        min-width: 96px;
+      }
     }
   }
 `;
@@ -107,6 +110,29 @@ export const repoFilesMobile = css`
   }
 `;
 
+// 仓库打开文件时的视图
+export const repoFileView = css`
+  .page-content.repository.file.list {
+    .repo-view-container {
+      // 右侧文件视图内容
+      .repo-view-content {
+        // 头部提交信息
+        #repo-file-commit-box {
+          padding: 8px 12px;
+          > .latest-commit {
+            gap: 8px;
+          }
+          // 右侧提交时间
+          > .age {
+            display: flex;
+            align-items: center;
+          }
+        }
+      }
+    }
+  }
+`;
+
 // 仓库代码布局调整, 侧边栏宽度调整
 export const repoGrid = css`
   .repo-grid-filelist-sidebar {
@@ -198,7 +224,7 @@ export const repoSidebarBottom = css`
         .color-icon {
           height: 8px;
           width: 8px;
-          margin-right: 6px;
+          margin-right: 8px;
         }
         .tw-font-semibold {
           color: ${themeVars.color.text.self};