What I’m trying to do:
Trying to change background color of side bar and menu bar
I must be missing something but I cant seem to find how to change these 2 backgrounds. (see attached)
The colour of the bar on top is determined by the colour of Primary 500, which is the first row in the Colour Scheme. So, apparantly no free choice.
The one below may be adjustable in the assets as a background-color in theme.css.
Top App Bar:
In Theme look for ‘app-bar’ - that is the top app bar
change the background color to desired one.
/* Components: App Bar */
.app-bar {
min-height: 56px;
padding: 0 16px 0 72px;
position: fixed;
width: 100%;
line-height: 40px;
font-size: 20px;
background-color: %color:Surface%;
transition: background-color 250ms;
-webkit-transition: background-color 250ms;
-moz-transition: background-color 250ms;
-o-transition: background-color 250ms;
z-index: 1;
}
Left Nav-Bar:
look for that line in theme:
.nav-holder .left-nav, .left-nav-placeholder {
display: flex;
flex-direction: column;
background: %color: Surface%;