diff --git a/.github/release.md b/.github/release.md index b96ca6d..2ba7a14 100644 --- a/.github/release.md +++ b/.github/release.md @@ -10,6 +10,7 @@ - 优化热力图和动态样式 - 优化私有标签样式, 组织页面下的 RSS 订阅按钮样式 - 同步用户点星仓库列表样式 +- 同步 Issue/PR 详细页面侧边栏样式 ## 🎈 Perf diff --git a/src/types/color/github.ts b/src/types/color/github.ts index ff36730..aff61f6 100644 --- a/src/types/color/github.ts +++ b/src/types/color/github.ts @@ -177,6 +177,7 @@ export const github = { * @repo `repoHeader` 仓库标题的悬停背景颜色 * @commit `commit` 提交信息的 Action 按钮的悬停背景颜色 * @filelist `repoFiles` README 栏的按钮的悬停背景颜色 + * @issue `issueSidebar` 操作按钮的悬停背景颜色 */ hover: null, }, diff --git a/styles/components/issue.ts b/styles/components/issue.ts index ed55b6a..4034e76 100644 --- a/styles/components/issue.ts +++ b/styles/components/issue.ts @@ -18,6 +18,11 @@ export const button = css` color: ${themeVars.github.fgColor.success}; } } + // 工单&PR标题右侧按钮 + .repository.view.issue .issue-title-buttons > .ui.button { + padding: 0 12px; + height: 32px; + } `; export const babel = css` @@ -103,6 +108,7 @@ export const comment = css` } .comment-header { padding: 4px 4px 4px 16px; + min-height: 38px; } .comment-header-right { > .item, @@ -330,3 +336,102 @@ export const timeline = css` } } `; + +const sidebarPadding = { + padding: "4px 8px", +}; + +// 侧边栏 +export const issueSidebar = css` + .issue-content { + gap: 24px; + .issue-content-right { + border: 0; + font-size: 12px; + padding: 0; + .ui.button { + font-size: 12px; + } + > .flex-text-block, + .ui.form, + a.fixed-text.muted, + span.text, + // 列表项为空时的文字 + span.item.empty-list, + p { + color: ${themeVars.color.text.light.num1}; + font-size: 12px; + } + .ui.dropdown.select-branch, + .ui.form, + a.fixed-text.muted, + span.text, + .ui.watching > div, + .ui.depending > div, + .flex-text-block, + .ui.list, + p { + ${sidebarPadding}; + } + .issue-sidebar-combo { + .ui.dropdown > a.fixed-text.muted { + align-items: center; + border-radius: ${otherThemeVars.border.radius}; + text-decoration-line: none; + height: 28px; + &:hover { + background: ${themeVars.github.control.transparent.bgColor.hover}; + } + } + .ui.list { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + } + // 选中日期颜色 + .ui.form .due-date { + color: ${themeVars.color.text.self}; + } + .divider { + margin: 12px 0 12px 8px; + width: calc(100% - 16px); + } + // 订阅按钮 + .ui.watching .ui.button { + padding: 0px 8px; + height: 28px; + svg { + margin: 0 !important; + } + } + // PIN 按钮 + .form-fetch-action.single-button-form .ui.button, + // 底部操作按钮 + .ui.show-modal.button { + border: 0; + background: unset; + font-weight: 400; + ${sidebarPadding}; + // 好像是浏览器 BUG, 最后不生效, 必须 !important + margin: 0 !important; + justify-content: left; + &:hover { + background: ${themeVars.github.control.transparent.bgColor.hover}; + } + } + .ui.show-modal.button[data-modal="#sidebar-delete-issue"] { + color: ${themeVars.color.red.self}; + svg { + color: ${themeVars.color.red.self}; + } + &:hover { + background-color: ${themeVars.color.red.badge.bg}; + color: ${themeVars.color.red.light}; + svg { + color: ${themeVars.color.red.light}; + } + } + } + } + } +`;