Confluence CSS site-wide style sheet
Platform Notice: Server and Data Center Only - This article only applies to Atlassian products on the server and data center platforms.
Summary
You need to customize the CSS stylesheet of multiple spaces and don't want to rely on manually editing each color field in the Space Tools > Look and Feel > Color Scheme page. This article may help you to achieve this.
Solution
This is a comprehensive CSS style sheet that compiles most of the color fields from that page and includes the CSS block to also customize sidebar color. It can be used in the Space Tools > Look and Feel > Stylesheet page:
/*Top Bar*/
#header .aui-header {
background-color: #bb2222;
}
/*Top Bar Text*/
.aui-header .aui-dropdown2-trigger, #header .aui-header .aui-nav-link, #header .aui-header .aui-nav-imagelink, #header .aui-header a {
color: #00cc00;
}
/*Header Button Background*/
#header .aui-header .aui-nav .aui-button-primary{
background-color: #FF4444;
}
/*Header Button Text*/
#header .aui-header .aui-nav .aui-button-primary{
color: #00cc00;
}
/*Top Bar Menu Selected Background*/
#header .aui-header a:focus, #header .aui-header a:hover, #header .aui-header .aui-nav-imagelink:hover, #header .aui-header a:active {
background-color: rgba(100, 9, 9, 0.48);
}
/*Top Bar Menu Selected Text*/
#header .aui-header a:focus, #header .aui-header a:hover, #header .aui-header .aui-nav-imagelink:hover, #header .aui-header a:active {
color: #FF0000;
}
/*Top Bar Menu Item Text*/
.aui-dropdown2-in-header.aui-style-default a, .aui-dropdown2-in-header.aui-style-default a:visited, .aui-dropdown2-in-header.aui-style-default a:link, .aui-dropdown2-in-header.aui-style-default:hover a, .aui-dropdown2-in-header.aui-style-default:hover a:visited, .aui-dropdown2-in-header.aui-style-default:hover a:link {
color: #00FF00;
}
/*Menu Item Selected Background*/
.aui-dropdown2.aui-style-default:hover a:not(.aui-dropdown2-disabled):focus, .aui-dropdown2.aui-style-default:hover a:not(.aui-dropdown2-disabled):hover, .aui-dropdown2.aui-style-default:hover a.active:not(.aui-dropdown2-disabled), .aui-dropdown2.aui-style-default:hover .aui-dropdown2-radio:not(.aui-dropdown2-disabled):hover {
background-color: #000044;
}
/*Menu Item Selected Text*/
.aui-dropdown2.aui-style-default:hover a:not(.aui-dropdown2-disabled):focus, .aui-dropdown2.aui-style-default:hover a:not(.aui-dropdown2-disabled):hover, .aui-dropdown2.aui-style-default:hover a.active:not(.aui-dropdown2-disabled), .aui-dropdown2.aui-style-default:hover .aui-dropdown2-radio:not(.aui-dropdown2-disabled):hover {
color: #FF00FF;
}
/*Search Field Background*/
.aui-header .aui-quicksearch input[type='text']{
background-color: rgba(100, 9, 9, 0.48);
}
/*Search Field Text*/
.aui-header .aui-quicksearch:after, .aui-header .aui-quicksearch input[type='text'][type='text']:focus {
color: #FF0000;
}
/*Heading Text*/
h1, h2, h3, h4, .wiki-content h1, .wiki-content h2, .wiki-content h3, .wiki-content h4{
color: #888800;
}
/*Links*/
.wiki-content a, .wiki-content a:link, .wiki-content a:visited, .wiki-content a:focus, .wiki-content a:hover, .wiki-content a:active {
color: #CC00CC;
}
/*Sidebar*/
.acs-side-bar {
background-color: #f4f5f7;
}