GitHub Red Issues

Turns the issue color of closed issues from purple back to red - back reddish color icon for closed github issues.

当前为 2025-05-06 提交的版本,查看 最新版本

  1. /* ==UserStyle==
  2. @name GitHub Red Issues
  3. @namespace github.com/openstyles/stylus
  4. @version 9.7.0
  5. @description Turns the issue color of closed issues from purple back to red - back reddish color icon for closed github issues.
  6. @author Katsute
  7.  
  8. // @collaborator kidonng
  9. // @contributor krystian3w
  10. // @contributor iam-py-test
  11. // @alterantive obfuscatedgenerated
  12. // @compatible firefox Firefox 121+
  13. // @compatible chrome Chrome 105+
  14. // @compatible edge Edge 105+
  15. // @compatible opera Opera 91+
  16. // @compatible safari Safari 15.4+
  17. @license CC BY-NC-SA 4.0 https://creativecommons.org/licenses/by-nc-sa/4.0/
  18. ==/UserStyle== */
  19. @-moz-document domain("github.com"), domain("github-com.translate.goog"), regexp("^https?:\\/\\/translated\\.turbopages\\.org\\/proxy_u\\/.*/https\\/github\\.com\\/.*"), regexp("^https:\\/\\/web\\.archive\\.org\\/web\\/[0-9]+\\/https?\\:\\/\\/github.com\\/.*"), regexp("^https:\\/\\/archive\\.[\\w]{2,10}\\/[0-9.-]+\\\\/https?\\:\\/\\/github.com\\/.*") {
  20. /* powered on https://raw.githubusercontent.com/Katsute/GitHub-Red-Issues/main/src/style.css */
  21. /* Copyright (C) 2025 Katsute <https://github.com/Katsute> */
  22.  
  23. :root {
  24. --rissue-issue-closed : var(--bgColor-closed-emphasis, #da3633);
  25. --rissue-issue-closed-fg : var(--fgColor-closed, #f85149);
  26. --rissue-issue-closed-bg : var(--bgColor-closed-muted, #f8514926);
  27. }
  28.  
  29. :not(
  30. react-app[app-name="repo-deployments"] div,
  31. react-app[app-name="blackbird-search"] li,
  32. button[data-testid="mark-as-action-menu-button"] *,
  33. ul[data-testid="mark-as-action-menu-list"] *
  34. ) > :not(
  35. span.State--merged,
  36. span[class^="StateLabel__StateLabelBase"],
  37. projects-v2 span[class^="StateLabel__StateLabelBase"],
  38. .TimelineItem-Badge,
  39. .TimelineItem-badge,
  40. div:is([class^="prc-Timeline-TimelineBadge-"],[class*=" prc-Timeline-TimelineBadge-"]),
  41. a[href*="/discussions"],
  42. .hx_anim-fade-out,
  43. a[href$="state=closed"] > span,
  44. h2:has(> a[href$="/deployments"]) + ul > li
  45. ) > :is(
  46. /* issue icon */
  47. svg.octicon-issue-closed,
  48. /* project icon */
  49. svg:has(path[d="M11.28 6.78a.75.75 0 0 0-1.06-1.06L7.25 8.69 5.78 7.22a.75.75 0 0 0-1.06 1.06l2 2a.75.75 0 0 0 1.06 0l3.5-3.5Z"] + path[d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0Zm-1.5 0a6.5 6.5 0 1 0-13 0 6.5 6.5 0 0 0 13 0Z"]),
  50. /* search issue icon */
  51. svg:has(path[d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm1.5 0a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm10.28-1.72-4.5 4.5a.75.75 0 0 1-1.06 0l-2-2a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018l1.47 1.47 3.97-3.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"]),
  52. /* discussion icon */
  53. svg.octicon-discussion-closed
  54. ):not(.color-fg-muted){
  55. color: var(--rissue-issue-closed-fg) !important;
  56. }
  57.  
  58. /* closed projects */
  59. projects-v2 div:has(> span ~ h1) span[data-variant="done"] {
  60. border-color: var(--rissue-issue-closed) !important;
  61. background-color: var(--rissue-issue-closed-fg) !important;
  62. }
  63.  
  64. svg:has(path[d="M11.28 6.78a.75.75 0 0 0-1.06-1.06L7.25 8.69 5.78 7.22a.75.75 0 0 0-1.06 1.06l2 2a.75.75 0 0 0 1.06 0l3.5-3.5Z"]) path{
  65. fill: unset !important;
  66. }
  67.  
  68. :is(
  69. span.State--merged, /* issue badge (legacy) */
  70. .TimelineItem-badge, /* timeline icon (legacy) */
  71. ):has(svg.octicon-issue-closed, svg.octicon-discussion-closed),
  72. :is(
  73. span[class^="StateLabel__StateLabelBase"], /* new issue badge & projects v2 */
  74. ):has(path[d="M11.28 6.78a.75.75 0 0 0-1.06-1.06L7.25 8.69 5.78 7.22a.75.75 0 0 0-1.06 1.06l2 2a.75.75 0 0 0 1.06 0l3.5-3.5Z"] + path[d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0Zm-1.5 0a6.5 6.5 0 1 0-13 0 6.5 6.5 0 0 0 13 0Z"]),
  75. /* timeline icon (legacy) */
  76. .TimelineItem-Badge:has(path[d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm1.5 0a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm10.28-1.72-4.5 4.5a.75.75 0 0 1-1.06 0l-2-2a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018l1.47 1.47 3.97-3.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"]),
  77. /* timeline icon */
  78. div:is([class^="prc-Timeline-TimelineBadge-"],[class*=" prc-Timeline-TimelineBadge-"]):has(path[d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm1.5 0a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm10.28-1.72-4.5 4.5a.75.75 0 0 1-1.06 0l-2-2a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018l1.47 1.47 3.97-3.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"]){
  79. border-color: var(--rissue-issue-closed) !important;
  80. box-shadow: var(--boxShadow-thin, inset 0 0 0 max(1px, 0.0625rem)) var(--rissue-issue-closed) !important;
  81. background-color: var(--rissue-issue-closed) !important;
  82. }
  83.  
  84. /* sub issue circle */
  85. svg[class^="ProgressCircle-module__completedIcon"] > circle{
  86. stroke: var(--rissue-issue-closed) !important;
  87. }
  88.  
  89. /* progress circle */
  90. :is(
  91. #issue-viewer-side-panel,
  92. react-app[app-name="issues-react"]
  93. ) :is(
  94. circle[class^="ProgressCircle-module__circleProgressShade"],
  95. circle[class^="ProgressCircle-module__circleProgress"]
  96. ),
  97. projects-v2 svg[data-target="tracked-issues-progress.progress"] circle[stroke-dashoffset]{
  98. stroke: var(--rissue-issue-closed) !important;
  99. }
  100.  
  101. /* progress check */
  102. :is(
  103. projects-v2,
  104. #issue-viewer-side-panel,
  105. react-app[app-name="issues-react"]
  106. ) :is(
  107. svg[class^="ProgressCircle-module__completedIcon"]
  108. ) > path{
  109. fill: var(--rissue-issue-closed) !important;
  110. }
  111. /* powered on https://raw.githubusercontent.com/Katsute/GitHub-Red-Issues/main/src/style.css */
  112. /* Copyright (C) 2025 Katsute <https://github.com/Katsute> */
  113. }