Azure DevOps: Highlight PR Comment State latest version (currently v1.0.0)

← Back to Stylus Rules

Install Style

Style Content

/* ==UserStyle==
@name           Azure DevOps: Highlight PR Comment State
@namespace      https://www.timhilton.xyz/stylus-rules/
@version        1.0.0
@description    Color-codes PR comment states (Active, Pending, Resolved) in Azure DevOps with distinctive colors for quick status identification
@author         Tim Hilton
@homepageURL    https://www.timhilton.xyz/stylus-rules/azure-devops/highlight-pr-comment-state/
@updateURL      https://www.timhilton.xyz/stylus-rules/azure-devops/highlight-pr-comment-state/latest/highlight-pr-comment-state.user.css
==/UserStyle==*/

@-moz-document regexp("https://dev.azure.com/.*/pullrequest/.*") {
:root {
    --resolved: limegreen;
    --active: indianred;
    --pending: steelblue;
}

button[aria-label="State button Resolved mode"] {
    border: 2px solid green !important;
    background-color: var(--resolved) !important;
}

button[aria-label="State button Active mode"] {
    border: 2px solid red !important;
    background-color: var(--active) !important;
}

button[aria-label="State button Pending mode"] {
    border: 2px solid dodgerblue !important;
    background-color: var(--pending) !important;
}

table[aria-label^="State button"] tr[aria-posinset="1"]/* Active */
{
    background-color: var(--active);
}

table[aria-label^="State button"] tr[aria-posinset="2"]/* Pending */
{
    background-color: var(--pending);
}

table[aria-label^="State button"] tr[aria-posinset="3"]/* Resolved */
{
    background-color: var(--resolved);
}
}