代码整理

src/core/github.ts

@@ -39,107 +39,40 @@ export type GithubColor = {
     muted: string;
   };
   bgColor: {
-    accent: {
+    accent: { emphasis: string; muted: string };
-      emphasis: string;
+    attention: { muted: string };
-      muted: string;
+    success: { emphasis: string; muted: string };
-    };
+    danger: { muted: string };
-    attention: {
+    done: { emphasis: string };
-      muted: string;
-    };
-    success: {
-      emphasis: string;
-      muted: string;
-    };
-    danger: {
-      muted: string;
-    };
-    done: {
-      emphasis: string;
-    };
     default: string;
     inset: string;
     muted: string;
-    neutral: {
+    neutral: { muted: string };
-      muted: string;
-    };
   };
   borderColor: {
-    accent: {
+    accent: { emphasis: string };
-      emphasis: string;
+    attention: { emphasis: string };
-    };
-    attention: {
-      emphasis: string;
-    };
     default: string;
-    success: {
+    success: { emphasis: string };
-      emphasis: string;
+    done: { emphasis: string };
-    };
-    done: {
-      emphasis: string;
-    };
     muted: string;
     translucent: string;
   };
   button: {
-    primary: {
+    primary: { fgColor: { rest: string }; bgColor: { hover: string } };
-      fgColor: {
+    danger: { fgColor: { rest: string; hover: string }; bgColor: { hover: string } };
-        rest: string;
-      };
-      bgColor: {
-        hover: string;
-      };
-    };
-    danger: {
-      fgColor: {
-        rest: string;
-        hover: string;
-      };
-      bgColor: {
-        hover: string;
-      };
-    };
   };
   control: {
-    bgColor: {
+    bgColor: { active: string; hover: string; rest: string };
-      active: string;
+    transparent: { bgColor: { active: string; hover: string; selected: string } };
-      hover: string;
-      rest: string;
-    };
-    transparent: {
-      bgColor: {
-        active: string;
-        hover: string;
-        selected: string;
-      };
-    };
-  };
-  shadow: {
-    floating: {
-      small: string;
-    };
-  };
-  overlay: {
-    backdrop: {
-      bgColor: string;
-    };
-  };
-  underlineNav: {
-    borderColor: {
-      active: string;
-    };
   };
+  shadow: { floating: { small: string } };
+  overlay: { backdrop: { bgColor: string } };
+  underlineNav: { borderColor: { active: string } };
   contribution: {
     default: {
-      bgColor: {
+      bgColor: { num0: string; num1: string; num2: string; num3: string; num4: string };
-        num0: string;
+      borderColor: { num0: string };
-        num1: string;
-        num2: string;
-        num3: string;
-        num4: string;
-      };
-      borderColor: {
-        num0: string;
-      };
     };
   };
 };

src/core/prettylights.ts

@@ -2,47 +2,22 @@ import type { Chroma } from "src/types";
 
 export type prettylightsColor = {
   syntax: {
-    brackethighlighter: {
+    brackethighlighter: { angle: string; unmatched: string };
-      angle: string;
+    carriage: { return: { bg: string; text: string } };
-      unmatched: string;
-    };
-    carriage: {
-      return: {
-        bg: string;
-        text: string;
-      };
-    };
     comment: string;
     constant: string;
     constantOtherReferenceLink: string;
     entity: string;
     entityTag: string;
-    invalid: {
+    invalid: { illegal: { bg: string; text: string } };
-      illegal: {
-        bg: string;
-        text: string;
-      };
-    };
     keyword: string;
     markup: {
       bold: string;
-      changed: {
+      changed: { bg: string; text: string };
-        bg: string;
+      deleted: { bg: string; text: string };
-        text: string;
-      };
-      deleted: {
-        bg: string;
-        text: string;
-      };
       heading: string;
-      ignored: {
+      ignored: { bg: string; text: string };
-        bg: string;
+      inserted: { bg: string; text: string };
-        text: string;
-      };
-      inserted: {
-        bg: string;
-        text: string;
-      };
       italic: string;
       list: string;
     };

src/core/theme.ts

@@ -39,9 +39,7 @@ export function createTheme(theme: Theme): void {
   }
   createGlobalTheme(":root", themeVars, theme);
   createGlobalTheme(":root", otherThemeVars, {
-    border: {
+    border: { radius: "6px" },
-      radius: "6px",
-    },
     color: {
       git: "#f05133",
       light: {

src/types/color/main.ts

@@ -1,12 +1,4 @@
-const num = {
+const num = { num1: null, num2: null, num3: null, num4: null, num5: null, num6: null, num7: null };
-  num1: null,
-  num2: null,
-  num3: null,
-  num4: null,
-  num5: null,
-  num6: null,
-  num7: null,
-};
 
 const alpha = {
   num10: null,
@@ -20,33 +12,12 @@ const alpha = {
   num90: null,
 };
 
-export const primary = {
+export const primary = { self: null, contrast: null, dark: num, light: num, alpha: alpha, hover: null, active: null };
-  self: null,
-  contrast: null,
-  dark: num,
-  light: num,
-  alpha: alpha,
-  hover: null,
-  active: null,
-};
 
 export const secondary = {
   self: null,
-  dark: {
+  dark: { num8: null, num9: null, num10: null, num11: null, num12: null, num13: null, ...num },
-    num8: null,
+  light: { num1: null, num2: null, num3: null, num4: null },
-    num9: null,
-    num10: null,
-    num11: null,
-    num12: null,
-    num13: null,
-    ...num,
-  },
-  light: {
-    num1: null,
-    num2: null,
-    num3: null,
-    num4: null,
-  },
   alpha: alpha,
   button: null,
   hover: null,

src/types/color/message.ts

@@ -1,32 +1,8 @@
-const msg = {
+const msg = { bg: null, border: null, text: null };
-  bg: null,
-  border: null,
-  text: null,
-};
 
-const error = {
+const error = { ...msg, bg: { self: null, active: null, hover: null } };
-  ...msg,
+const success = { ...msg };
-  bg: {
+const warning = { ...msg };
-    self: null,
+const info = { ...msg };
-    active: null,
-    hover: null,
-  },
-};
 
-const success = {
+export const message = { error, success, warning, info };
-  ...msg,
-};
-
-const warning = {
-  ...msg,
-};
-const info = {
-  ...msg,
-};
-
-export const message = {
-  error,
-  success,
-  warning,
-  info,
-};

src/types/color/named.ts

@@ -1,11 +1,4 @@
-const baseColor = {
+const baseColor = { self: null, light: null, dark: { num1: null, num2: null } };
-  self: null,
-  light: null,
-  dark: {
-    num1: null,
-    num2: null,
-  },
-};
 
 const commitColor = {
   /** 提交哈希值颜色 */
@@ -23,26 +16,14 @@ const commitColor = {
 
 export const named = {
   /** 红色/提交警告签名颜色 */
-  red: {
+  red: { ...commitColor, ...baseColor },
-    ...commitColor,
-    ...baseColor,
-  },
   /** 橙色/提交未匹配签名颜色 */
-  orange: {
+  orange: { ...commitColor, ...baseColor },
-    ...commitColor,
-    ...baseColor,
-  },
   /** 黄色/提交未信任签名颜色 */
-  yellow: {
+  yellow: { ...commitColor, ...baseColor },
-    ...commitColor,
-    ...baseColor,
-  },
   olive: baseColor,
   /** 绿色/提交信任签名颜色 */
-  green: {
+  green: { ...commitColor, ...baseColor },
-    ...commitColor,
-    ...baseColor,
-  },
   teal: baseColor,
   blue: baseColor,
   violet: baseColor,
@@ -50,10 +31,7 @@ export const named = {
   pink: baseColor,
   brown: baseColor,
   black: baseColor,
-  grey: {
+  grey: { self: null, light: null },
-    self: null,
-    light: null,
-  },
   gold: null,
   white: null,
 };

src/types/vars.ts

@@ -8,9 +8,7 @@ function varMapper(prefix: string | null = null) {
       path = path.map(item => item.replace(/^num/, ""));
       value = path.join("-");
     }
-    if (prefix) {
+    if (prefix) value = `${prefix}-${value}`;
-      value = `${prefix}-${value}`;
-    }
     return value;
   };
 }
@@ -32,26 +30,13 @@ const vars = {
   github: color.github,
 };
 
-const otherVars = {
+const otherVars = { border: { radius: null }, color: { ...color.otherAuto } };
-  border: {
-    radius: null,
-  },
-  color: {
-    ...color.otherAuto,
-  },
-};
 
 const customVars = {
   cloneMenuWidth: "clone-menu-width",
-  explore: {
+  explore: { repolistColumns: "explore-repolist-columns", userlistColumns: "explore-userlist-columns" },
-    repolistColumns: "explore-repolist-columns",
-    userlistColumns: "explore-userlist-columns",
-  },
   userRepolistColumns: "user-repolist-columns",
-  org: {
+  org: { repolistColumns: "org-repolist-columns", userlistColumns: "org-userlist-columns" },
-    repolistColumns: "org-repolist-columns",
-    userlistColumns: "org-userlist-columns",
-  },
 };
 
 export const themeVars = createGlobalThemeContract(vars, varMapper());

styles/components/actions.ts

@@ -221,6 +221,7 @@ export const actionViewRight = css`
         padding: 8px 10px;
 
         &.selected {
+          // 滚动时固定在顶部的高度与 job-info-header 高度相同
           top: 80px;
         }