Changing Header and Footer Colors

[mark]

Hi. I'm sorry if this has been covered elsewhere. I searched the forums but didn't find an answer.

I need to change the colors of the header and footer areas of the page (please see the attached image).  The rest of the colors on the site are perfect, so selecting a different Sitewide CSS won't work. I just need to lighten these areas up a bit. 

Any help pointing me to the files and sections I need to change would be GREATLY appreciated. 

Thank you for your help,
Mark

[Brandin]

My suggestion since you're using Chrome:
Download a color finder extension, I use ColorZilla.
Unminify the CSS you are using (https://unminify.com/)
Search for that Color Code until you find the appropriate Header and Footer that is using it.

Thank you,
Brandin.

[jcarter]

i have a couple guesses. My first guess would be in the /users/css/sb-admin.css file. The second and much more complicated way. would be in the css theme file you have selected. Specifically in the /users/css/color_schemes/(your theme).css. It is ridiculously hard to find it each specific color in that file and you have to be willing to go through thousands of lines of code.

if you need any more information let me know!
-James Carter

[mark]

My suggestion since you're using Chrome:
Download a color finder extension, I use ColorZilla.
Unminify the CSS you are using (https://unminify.com/)
Search for that Color Code until you find the appropriate Header and Footer that is using it.

Thank you,
Brandin.

Thanks for this! I'll give it a try!

---

i have a couple guesses. My first guess would be in the /users/css/sb-admin.css file. The second and much more complicated way. would be in the css theme file you have selected. Specifically in the /users/css/color_schemes/(your theme).css. It is ridiculously hard to find it each specific color in that file and you have to be willing to go through thousands of lines of code.

if you need any more information let me know!
-James Carter

Thank you!
sb-admin.css has 

body {
margin-top: 50px;
background-color: #222;
}

Changing that color value did the trick for the bottom of the page. 

I couldn't find anything in that file which controlled to top nav bar color (but I may have missed it).

I also check my themes css as you suggested, but again I didn't find anything that would control the nav bar color. 

so, I have 1/2 the problem solved!

Thanks again

[Brandin]

Hi again Mark,

I am glad that James was able to locate the body in your sb-admin. I am almost certain (although I could be wrong) the navigation bar would be held in the actual bootstrap files. Although I don't have time now, I'll do my best to look into this further and let you know.

Brandin.

[jcarter]

Hey everyone. So I just changed my heading color and the way to do it is to go into the color scheme file, so for me I am using the flat file. What I literally had to do, is copy that file (I use Linux CLI so no graphical programs) on to my Mac then open the file in Visual Studio. That showed me every mention of the color in the file, i just scrolled till i found the color of the bar and replaced each instance of it with the color i wanted. i find it easier if you switch from the default css file, as when it is a different color it tends to be more distinct and easier to identity in the code. I don't have the time now, but if i get the chance i will try to find it again and make a note of it!

[mark]

Hi again Mark,

I am glad that James was able to locate the body in your sb-admin. I am almost certain (although I could be wrong) the navigation bar would be held in the actual bootstrap files. Although I don't have time now, I'll do my best to look into this further and let you know.

Brandin.

Thank you!

---

Hey everyone. So I just changed my heading color and the way to do it is to go into the color scheme file, so for me I am using the flat file. What I literally had to do, is copy that file (I use Linux CLI so no graphical programs) on to my Mac then open the file in Visual Studio. That showed me every mention of the color in the file, i just scrolled till i found the color of the bar and replaced each instance of it with the color i wanted.  i find it easier if you switch from the default css file, as when it is a different color it tends to be more distinct and easier to identity in the code. I don't have the time now, but if i get the chance i will try to find it again and make a note of it!

Thanks!