修复 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,10 +10,11 @@
- 修复 Issue/PR 侧边栏的时间追踪样式
- 修复 Issue/PR 详细页面中的部分文字颜色
- 修复 Issue/PR 详细页面中时间线上的标签样式
- 修复一些选择输入框的排列问题
## 📃 English
### 🌈 Style
##### More aligned with GitHub style
##### More aligned with GitHub style

View File

@@ -3,68 +3,73 @@ import { css, themeVars } from "src/types/vars";
export const label = css`
/* 所有标签, 但不包括 a 标签 */
/* 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,
span {
&.ui.ui.ui {
&.label {
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;
}
}
/* 主色调标签 */
&.primary {
background-color: unset;
border: 1px solid ${themeVars.color.primary.self};
color: ${themeVars.color.primary.self};
}
/* 红色标签 */
&.red {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.done.emphasis};
color: ${themeVars.color.purple.self};
}
/* 橙色标签 */
&.orange {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
color: ${themeVars.color.yellow.self};
}
/* 黄色标签 */
&.yellow {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
color: ${themeVars.color.orange.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};
}
&.ui.ui.ui.label {
/* 主色调标签 */
&.primary {
background-color: unset;
border: 1px solid ${themeVars.color.primary.self};
color: ${themeVars.color.primary.self};
}
/* 红色标签 */
&.red {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.done.emphasis};
color: ${themeVars.color.purple.self};
}
/* 橙色标签 */
&.orange {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
color: ${themeVars.color.yellow.self};
}
/* 黄色标签 */
&.yellow {
background-color: unset;
border: 1px solid ${themeVars.github.borderColor.attention.emphasis};
color: ${themeVars.color.orange.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};
}
}
}