Joomla Templates Club 406,261 posts

[rypetry Friend rypetryJoin date: March 2011Posts: 49Downloads:0Uploads:1 Thanks: 12 Thanked: 4 times in 1 posts]

#166725

Regarding the JA Portfolio template, I have managed to modify most of the colors of the mega menu including font color, main level and child menu background colors, as well as active menu item color. However, I am unable to change the black hover color.

Both IE developer tool and FF Firebug are telling me that the location is in mysite/t3-assets, but I even went in there to change the files and that didn’t work. I renamed the mysite/templates/ja_portfolio/css folder to something else to see if the file is located in there, but when I refresh the site, the black menu hover effect is still there. I’m ready to pull my hair out!

Thanks in advance for your suggestions.

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#403125

That would be the “Mega.css” file you are looking for.

/templates/ja_portfolio/css/menu/mega.css

One tip…if you are going to use Firebug, make sure you have turned off the CSS compression in your template settings. Only then can you truly see the correct path.

Have fun!
John.

1 user says Thank You to John Wesley Brett for this useful post

1. rypetry

[rypetry Friend rypetryJoin date: March 2011Posts: 49Downloads:0Uploads:1 Thanks: 12 Thanked: 4 times in 1 posts]

#403126

Thanks for the quick response jbrett – The mega.css file is the one I modified to get the other colors that I wanted to work; however, I cannot locate the text I need to change to replace the black color with the green color I want.

UPDATE: The tip to turn off css compression helped a great deal. I was unaware of that feature previously. Thank you for that – I was able to figure out that although I had the template set to “default theme” and that it was green, JA Portfolio pulled the mega.css file from the /templates/ja_portfolio/core/themes/blue-color/css/menu/mega.css file. The black hover color alone originates from that core theme directory.

Thanks again for leading me in the right direction.

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#403130

<em>@rypetry 255719 wrote:</em><blockquote>
/* Styling —*/
.ja-megamenu ul.level0 li.mega {
background: url(../../images/mainnav-sep.gif) repeat-y right;
}
</blockquote>

The above line controls the background. It is a little sliver of a “gif” file which you need to either change the color of or rewrite the code to read something along the lines of:


.ja-megamenu ul.level0 li.mega {
background: none repeat scroll 0 0 #FFFFFF;
}

…which would change the background to white. (#ffffff)

Have fun!
John.

1 user says Thank You to John Wesley Brett for this useful post

1. rypetry

[rypetry Friend rypetryJoin date: March 2011Posts: 49Downloads:0Uploads:1 Thanks: 12 Thanked: 4 times in 1 posts]

#403137

<em>@jbrett 255724 wrote:</em><blockquote>The above line controls the background. It is a little sliver of a “gif” file which you need to either change the color of or rewrite the code to read something along the lines of:


.ja-megamenu ul.level0 li.mega {
background: none repeat scroll 0 0 #FFFFFF;
}


…which would change the background to white. (#ffffff)

Have fun!
John.</blockquote>

I was able to figure out the problem – I amended my previous comment wherein I pasted the css text. It was pulling a different mega.css file from a completely different folder. Thanks though – without your help with the css compression, I never would have found the file. 🙂

[Author]

Posts