How to control background color in the NavBar

I agree it is ridiculous! It took me a day to figure out how to get the background black (well, it worked if I edited the body tag directly in my index.html, but that is not the right way and would only apply to that page)… Then I was astonished when it took me ANOTHER day to get the nav bar black! I added some other elements and it was easy to set the background color for them…

Now to make this work…

The code has to get into your custom.scss file. Mine looks like this (below)… To get to this stage… explained here (link below)…
You have to do (one time for each project) Page > Customize Bootstrap Theme
This will create the custom.scss file with the top part and the import part and some comments. It lives in the bootstrap_theme directory.

My custom.scss file (so far):

/* Bootstrap theme customized with Pinegrow Web Editor /
/
Vars go before the @import /
/
Import the Bootstrap files */
$body-bg: #000000;
$body-color: #EEEEEE;

/* First one is the dark font and the second the background of the nav bar */
$navbar-dark-active-color: #FFFFFF;
$dark: #000000;

/* Link colors */
$link-color: #dba63c;
$link-hover-color: #FF0000;

@import “bootstrap/bootstrap”;

/* Custom CSS rules come here */