同步 Issue/PR 详细页面侧边栏样式

This commit is contained in:
lutinglt
2025-08-12 20:57:03 +08:00
parent 60e873b0e0
commit 62bc2afa2a
3 changed files with 107 additions and 0 deletions

View File

@@ -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};
}
}
}
}
}
`;