diff --git a/CHANGELOG.md b/CHANGELOG.md index 7d33b24..8f7bfbd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,15 +2,16 @@ #### More aligned with GitHub style -- Optimize the selection style of items in the menu -- Optimize code block styles +- Optimize the selection style of items in the menu. +- Optimize code block styles. ##### Template File -- Synchronized repository commit page layout and styles -- Synchronized repository code list page layout and styles -- Synchronized repository add file button menu styles +- Synchronized repository commit page layout and styles. +- Synchronized repository code list page layout and styles. +- Synchronized repository add file button menu styles. ### 🐞 Fix - Fixed extra lines under heatmap. +- Supplement the PR operation panel status style in PR. diff --git a/src/core/github.ts b/src/core/github.ts index 84f33e0..81cdfb1 100644 --- a/src/core/github.ts +++ b/src/core/github.ts @@ -42,10 +42,10 @@ export type GithubColor = { }; bgColor: { accent: { emphasis: string; muted: string }; - attention: { muted: string }; + attention: { emphasis: string; muted: string }; emphasis: string; success: { emphasis: string; muted: string }; - danger: { muted: string }; + danger: { emphasis: string; muted: string }; done: { emphasis: string }; default: string; inset: string; @@ -240,6 +240,12 @@ export function github2ThemeColor(githubColor: GithubColor): ThemeColor { success: { emphasis: githubColor.bgColor.success.emphasis, }, + attention: { + emphasis: githubColor.bgColor.attention.emphasis, + }, + danger: { + emphasis: githubColor.bgColor.danger.emphasis, + }, done: { emphasis: githubColor.bgColor.done.emphasis, }, diff --git a/src/types/color/github.ts b/src/types/color/github.ts index eb6d216..2d1117e 100644 --- a/src/types/color/github.ts +++ b/src/types/color/github.ts @@ -53,9 +53,22 @@ export const github = { */ emphasis: null, }, + attention: { + /** 注意的背景颜色 + * @issue `prMerge` 头像颜色 + */ + emphasis: null, + }, + danger: { + /** 危险的背景颜色 + * @issue `prMerge` 头像颜色 + */ + emphasis: null, + }, done: { /** 完成的背景颜色 * @issue `babel` 工单已关闭图标背景颜色 + * @issue `prMerge` 头像颜色 */ emphasis: null, }, diff --git a/styles/components/issue.ts b/styles/components/issue.ts index 8b00d45..684643b 100644 --- a/styles/components/issue.ts +++ b/styles/components/issue.ts @@ -412,7 +412,6 @@ export const prMerge = css` .repository.view.issue .comment-list .timeline-item.pull-merge-box { // 头像 .timeline-avatar { - color: ${themeVars.color.white} !important; border-radius: 9999px; width: 40px; height: 40px; @@ -423,34 +422,67 @@ export const prMerge = css` width: 24px; height: 24px; } - // 可以合并 - &.green { - background-color: ${themeVars.github.bgColor.success.emphasis}; + // PR 界面的 PR 操作评论 + &.text { + color: ${themeVars.color.white} !important; border-radius: ${otherThemeVars.border.radius}; - // 操作评论边框色 + // 操作评论边框 + .content > .ui.attached.segment { - border-left-color: ${themeVars.github.bgColor.success.emphasis}; - border-right-color: ${themeVars.github.bgColor.success.emphasis}; - &:first-child { - border-top-color: ${themeVars.github.bgColor.success.emphasis}; - } - &:last-child { - border-bottom-color: ${themeVars.github.bgColor.success.emphasis}; + border-width: 1.5px; + } + &.grey { + background-color: ${themeVars.color.text.light.num1}; + } + &.green { + background-color: ${themeVars.github.bgColor.success.emphasis}; + + .content > .ui.attached.segment { + border-left-color: ${themeVars.github.bgColor.success.emphasis}; + border-right-color: ${themeVars.github.bgColor.success.emphasis}; + &:first-child { + border-top-color: ${themeVars.github.bgColor.success.emphasis}; + } + &:last-child { + border-bottom-color: ${themeVars.github.bgColor.success.emphasis}; + } } } - } - // 已合并 - &.purple { - background-color: ${themeVars.github.bgColor.done.emphasis}; - border-radius: ${otherThemeVars.border.radius}; - + .content > .ui.attached.segment { - border-left-color: ${themeVars.github.bgColor.done.emphasis}; - border-right-color: ${themeVars.github.bgColor.done.emphasis}; - &:first-child { - border-top-color: ${themeVars.github.bgColor.done.emphasis}; + &.purple { + background-color: ${themeVars.github.bgColor.done.emphasis}; + + .content > .ui.attached.segment { + border-left-color: ${themeVars.github.bgColor.done.emphasis}; + border-right-color: ${themeVars.github.bgColor.done.emphasis}; + &:first-child { + border-top-color: ${themeVars.github.bgColor.done.emphasis}; + } + &:last-child { + border-bottom-color: ${themeVars.github.bgColor.done.emphasis}; + } } - &:last-child { - border-bottom-color: ${themeVars.github.bgColor.done.emphasis}; + } + &.yellow { + background-color: ${themeVars.github.bgColor.attention.emphasis}; + + .content > .ui.attached.segment { + border-left-color: ${themeVars.github.bgColor.attention.emphasis}; + border-right-color: ${themeVars.github.bgColor.attention.emphasis}; + &:first-child { + border-top-color: ${themeVars.github.bgColor.attention.emphasis}; + } + &:last-child { + border-bottom-color: ${themeVars.github.bgColor.attention.emphasis}; + } + } + } + &.red { + background-color: ${themeVars.github.bgColor.danger.emphasis}; + + .content > .ui.attached.segment { + border-left-color: ${themeVars.github.bgColor.danger.emphasis}; + border-right-color: ${themeVars.github.bgColor.danger.emphasis}; + &:first-child { + border-top-color: ${themeVars.github.bgColor.danger.emphasis}; + } + &:last-child { + border-bottom-color: ${themeVars.github.bgColor.danger.emphasis}; + } } } } diff --git a/themes/colorblind-dark.css.ts b/themes/colorblind-dark.css.ts index 407b277..5db2c88 100644 --- a/themes/colorblind-dark.css.ts +++ b/themes/colorblind-dark.css.ts @@ -25,7 +25,7 @@ export const colorblindDarkGithubColors: GithubColor = { }, bgColor: { ...darkGithubColors.bgColor, - danger: { muted: "#db6d281a" }, + danger: { emphasis: "#bd561d", muted: "#db6d281a" }, success: { emphasis: "#1f6feb", muted: "#388bfd33" }, }, borderColor: { diff --git a/themes/colorblind-light.css.ts b/themes/colorblind-light.css.ts index c56a985..8451a39 100644 --- a/themes/colorblind-light.css.ts +++ b/themes/colorblind-light.css.ts @@ -25,7 +25,7 @@ export const colorblindLightGithubColors: GithubColor = { }, bgColor: { ...lightGithubColors.bgColor, - danger: { muted: "#fff1e5" }, + danger: { emphasis: "#bc4c00", muted: "#fff1e5" }, success: { emphasis: "#0969da", muted: "#ddf4ff" }, }, borderColor: { diff --git a/themes/dark.css.ts b/themes/dark.css.ts index 9dd7f84..f78840e 100644 --- a/themes/dark.css.ts +++ b/themes/dark.css.ts @@ -45,8 +45,8 @@ export const darkGithubColors: GithubColor = { }, bgColor: { accent: { emphasis: "#1f6feb", muted: "#388bfd1a" }, - attention: { muted: "#bb800926" }, - danger: { muted: "#f851491a" }, + attention: { emphasis: "#9e6a03", muted: "#bb800926" }, + danger: { emphasis: "#da3633", muted: "#f851491a" }, default: "#0d1117", done: { emphasis: "#8957e5" }, emphasis: "#3d444d", diff --git a/themes/light.css.ts b/themes/light.css.ts index fb1cde6..87d7672 100644 --- a/themes/light.css.ts +++ b/themes/light.css.ts @@ -45,8 +45,8 @@ export const lightGithubColors: GithubColor = { }, bgColor: { accent: { emphasis: "#0969da", muted: "#ddf4ff" }, - attention: { muted: "#fff8c5" }, - danger: { muted: "#ffebe9" }, + attention: { emphasis: "#9a6700", muted: "#fff8c5" }, + danger: { emphasis: "#cf222e", muted: "#ffebe9" }, default: "#ffffff", done: { emphasis: "#8250df" }, emphasis: "#25292e", diff --git a/themes/soft-dark.css.ts b/themes/soft-dark.css.ts index b7e0de5..9fd9629 100644 --- a/themes/soft-dark.css.ts +++ b/themes/soft-dark.css.ts @@ -39,8 +39,8 @@ export const softDarkGithubColors: GithubColor = { }, bgColor: { accent: { emphasis: "#316dca", muted: "#4184e41a" }, - attention: { muted: "#ae7c1426" }, - danger: { muted: "#e5534b1a" }, + attention: { emphasis: "#966600", muted: "#ae7c1426" }, + danger: { emphasis: "#c93c37", muted: "#e5534b1a" }, default: "#212830", done: { emphasis: "#8256d0" }, emphasis: "#3d444d",