Sub Menu Color

Hi Guys,

The new main menu is amaizing, thank you for the quickly update.

We just want to change the sub menu color (from White to Blue) i only need to know the line and the file.

So i want to know if i can reduce the horizontal size of sub menu too.

thank you

Could you please post an url to your site?

Code: Select all

#gkHeaderNav .gkMainMenu .gkmenu > li div.childcontent {
background: #fff;
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
-moz-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
box-shadow: 0 0 5px rgba(0, 0, 0, .3);
border-radius: 3px;
margin-top: 0;
padding: 16px 12px;
text-transform: none;

background: #fff; - this

about line 1161 in template.css

Thank you

Advicing on editing template core css files is a bad idea.
@ancaida
Quark has a system of less compilation software allowing for advanced users to make changes fast. You can disable the "recompile .less files" option in template settings (if it is enabled), then:
please edit: /templates/gk_quark/css/override.css and add at its end:

Code: Select all

#gkHeaderNav .gkMainMenu .gkmenu > li div.childcontent {
background: #fff;
}


Please change #ff to your desired color.
Remember to enable "CSS override" in template settings - advanced section.

Thank you guys,

Just only want to change the sub menu font color from black to white.

Regards!!

Even that small kind of change is better to be done in override.css or even in the template settings area where you can enter it into custom textarea.

Thx @Cyberek
How can i change the text color??

Thank you

Text color of menu item?

Yes, thank you

Could you please post an url to your site?

Yes Sure,

http://www.flatcodes.com

My target is like your submenu color (blue background and white fonts).

Regards

To change submenu font color please use this code in override.css:

Code: Select all

#gkHeaderNav .gkMainMenu .gkmenu > li div.childcontent li > a {
color: #26292b;
}


To change hover color, use this code:

Code: Select all

#gkHeaderNav .gkMainMenu .gkmenu > li div.childcontent li > a:hover {
color: #4999d5;
}


u r the best!

Thanks for the words of appreciation
Please let me know if you would have any additional questions regarding this topic.

just only

Narrow the menu! (width)

Regards

Solved!!

#gkHeaderNav .gkMainMenu .gkmenu > li div.childcontent {
width: 30%;
}

Yep, thats exactly it.
Ps, you can use [ CODE] some html/css/php code [/CODE ] (without spaces) to wrap code and display it better.