修复 Issue/PR 详细页面中时间线上的标签样式

This commit is contained in:
lutinglt
2025-11-01 13:49:37 +08:00
parent 07c6f0a78e
commit e537b75bad
2 changed files with 67 additions and 61 deletions

View File

@@ -10,6 +10,7 @@
- 修复 Issue/PR 侧边栏的时间追踪样式 - 修复 Issue/PR 侧边栏的时间追踪样式
- 修复 Issue/PR 详细页面中的部分文字颜色 - 修复 Issue/PR 详细页面中的部分文字颜色
- 修复 Issue/PR 详细页面中时间线上的标签样式
- 修复一些选择输入框的排列问题 - 修复一些选择输入框的排列问题
## 📃 English ## 📃 English

View File

@@ -3,68 +3,73 @@ import { css, themeVars } from "src/types/vars";
export const label = css` export const label = css`
/* 所有标签, 但不包括 a 标签 */ /* 所有标签, 但不包括 a 标签 */
/* a 标签比如仓库点星等按钮旁边的数字标签按钮,提交图中的 tag 标签 */ /* a 标签比如仓库点星等按钮旁边的数字标签按钮,提交图中的 tag 标签 */
div.label,
span.label,
// 包含多个标签的元素, 比如 Issue/PR 详情页中的时间线上的标签
span.labels-list a.label {
&.ui.ui.ui {
border-radius: 9999px;
padding: 1.5px 6px;
// 多个标签的组合标签的圆角修复
&.scope-parent {
.scope-left {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.scope-middle {
border-radius: 0;
}
.scope-right {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
}
}
}
div, div,
span { span {
&.ui.ui.ui { &.ui.ui.ui.label {
&.label { /* 主色调标签 */
border-radius: 9999px; &.primary {
padding: 1.5px 6px; background-color: unset;
// 多个标签的组合标签的圆角修复 border: 1px solid ${themeVars.color.primary.self};
&.scope-parent { color: ${themeVars.color.primary.self};
.scope-left { }
border-top-right-radius: 0; /* 红色标签 */
border-bottom-right-radius: 0; &.red {
} background-color: unset;
.scope-middle { border: 1px solid ${themeVars.github.borderColor.done.emphasis};
border-radius: 0; color: ${themeVars.color.purple.self};
} }
.scope-right { /* 橙色标签 */
border-top-left-radius: 0; &.orange {
border-bottom-left-radius: 0; background-color: unset;
} border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
} color: ${themeVars.color.yellow.self};
/* 主色调标签 */ }
&.primary { /* 黄色标签 */
background-color: unset; &.yellow {
border: 1px solid ${themeVars.color.primary.self}; background-color: unset;
color: ${themeVars.color.primary.self}; border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
} color: ${themeVars.color.orange.self};
/* 红色标签 */ }
&.red { /* 黄绿色标签 */
background-color: unset; &.olive {
border: 1px solid ${themeVars.github.borderColor.done.emphasis}; background-color: unset;
color: ${themeVars.color.purple.self}; border: 1px solid ${themeVars.color.olive.self};
} color: ${themeVars.color.olive.self};
/* 橙色标签 */ }
&.orange { /* 绿色标签 */
background-color: unset; &.green {
border: 1px solid ${themeVars.github.borderColor.attention.emphasis}; background-color: unset;
color: ${themeVars.color.yellow.self}; border: 1px solid ${themeVars.github.borderColor.success.emphasis};
} color: ${themeVars.color.green.self};
/* 黄色标签 */ }
&.yellow { /* 紫色标签 */
background-color: unset; &.purple {
border: 1px solid ${themeVars.github.borderColor.attention.emphasis}; background-color: unset;
color: ${themeVars.color.orange.self}; border: 1px solid ${themeVars.github.borderColor.done.emphasis};
} color: ${themeVars.color.purple.self};
/* 黄绿色标签 */
&.olive {
background-color: unset;
border: 1px solid ${themeVars.color.olive.self};
color: ${themeVars.color.olive.self};
}
/* 绿色标签 */
&.green {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.success.emphasis};
color: ${themeVars.color.green.self};
}
/* 紫色标签 */
&.purple {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.done.emphasis};
color: ${themeVars.color.purple.self};
}
} }
} }
} }