Skip to content

Jira/Bitbucket/Confluence Dark by spacekh

Details

Authorspacekh

LicenseNo License

CategoryBitbucket, Confluence, Jira

Created

Updated

Size1.7 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Dark mode for Jira, Bitbucket, and Confluence.

Notes

Plenty of things could still be tweaked, and Atlassian keeps changing CSS selectors, so input is appreciated. I update the style when things get too annoying in my own work; other than that, I'll take requests under consideration depending on my own perception of utility vs difficulty.

Source code

/* ==UserStyle==
@name         Jira/Bitbucket/Confluence Dark
@version      20220107.19.07
@namespace    userstyles.world/user/spacekh
@description  Dark mode for Jira, Bitbucket, and Confluence.
@author       spacekh
@license      No License
==/UserStyle== */

@-moz-document domain("bitbucket.org") {
#page, [role=dialog] {
    filter: saturate(80%) invert(95%) hue-rotate(180deg);
    background-color: white;
}

span[role=img], span.emoji-common-emoji-sprite {
    filter: saturate(200%) invert(95%) hue-rotate(180deg);
}

[data-testid=Content], [data-testid=ContextualNavigation] {
    filter: saturate(80%) invert(95%) hue-rotate(180deg);
    background-color: white;
}

main {
    background-clip: content-box;
    box-shadow: inset 0 0 0 100vw white;
}

body{
    background-color: #0d0d0d;
}

[data-testid=GlobalNavigation] {
    filter: saturate(.3) brightness(300%) invert(1) hue-rotate(220deg);
}
}

@-moz-document domain("atlassian.net") {
#jira, #root, iframe, #toolbar, #savebar-container, #com-atlassian-confluence {
    filter: saturate(80%) invert(95%) hue-rotate(180deg);
    background-color: white;
}

main {
    background-clip: content-box;
    box-shadow: inset 0 0 0 100vw white;
}

boady{
    background-color: #0d0d0d;
}

#toolbar {
    z-index: 1000;
}

span[role=img], span.emoji-common-emoji-sprite, img.ghx-avatar-img, img {
    filter: saturate(200%) invert(95%) hue-rotate(180deg);
}
}

@-moz-document regexp(".*\\.atlassian\\.net/wiki/.*/edit/.*"), regexp(".*\\.atlassian\\.net/wiki/.*/create.*") {
#content, main{
    filter: invert(.85) hue-rotate(180deg) contrast(1.5) saturate(2);
    background-color: white;
}
}

Reviews

No reviews yet.