Joomla Templates Club 406,261 posts

[devax Friend devaxJoin date: November 2010Posts: 18Downloads:1Uploads:3 Thanks: 4]

#201614

I was able to change the color of the top nav bar in the template.css file, but I can’t figure out how to change the color of the font. I see a lot of font callouts (size and style), but don’t see text color.

Any suggestions?

Thanks,

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#550790

Hello
go to template.css and find this code >>
.navbar .nav > li > a {
float: none;
padding: 15px 15px 15px;
color: #666

change the color code as per your need .>> #666

If you want to change the color on hover of menu .
go to template.css and find this code

.ja-mainnav .navbar .nav > li > a:hover{
color: #f76000
background: #fff
outline: none;
text-shadow: none;
}

change the color code value as per your need .

these suggestions are based on demo site .
please share your site url here so that i can give you exact codes .

[devax Friend devaxJoin date: November 2010Posts: 18Downloads:1Uploads:3 Thanks: 4]

#550818

Thank you for the quick response Pankahsharma. But unfortunately, I was unable to find the “.navbar .nav > li > a {” that you mention above in the template.css file (I am making changes to the Blue template.

Here is the link:

http://mp611.org

As you can see, the words inside the top nav bar can’t be read because they are dark and the new blue color is too close. I want to make the text white.

Thank you again for the help.

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#550819

Hello
Go to
/*===============================
/templates/ja_mitius/css/themes/blue/bootstrap.css
================================================================================*/

find this code

.navbar .nav > li > a {
float: none;
padding: 15px 15px 15px;
color: #666;
text-decoration: none;
text-shadow: 0 1px 0 #fff;
}

and change it into

.navbar .nav > li > a {
float: none;
padding: 15px 15px 15px;
color: #fff;
text-decoration: none;
text-shadow: 0 1px 0 #fff;
}

it will look like this >>> http://prntscr.com/4qeis3

1 user says Thank You to Pankaj Sharma for this useful post

1. devax

[devax Friend devaxJoin date: November 2010Posts: 18Downloads:1Uploads:3 Thanks: 4]

#550880

Thank you so much. Perfect!!!

[Author]

Posts