We moved to new unified forum!

Please post all new support queries in our New Forum.

T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
Subscribe via RSS  Subscribe via email
Recent
Categories
Tags
Users
Badges
View Replies (3)

Resolved Where do I set the colors for the megamenu active and hover states?

0
Votes
Undo
  1. Trent Perez
    Trent Perez
  2. Sherlock Holmes
  3. General Discussion
  4. Sunday, 06 September 2015
  5.  Subscribe via email
I am trying to change the button colors for the dropdown menus, the active button color and the color of the background for the hover state for the megamenu but I cannot find where those colors are set. I also cannot figure out how to find the correct class for setting the colors for just one item since I do not fully understand how the classes work in the T3 framework. I see lines like
<div class="t3-navbar navbar-collapse collapse">

But I am not sure if this is one single class or a combination of a few different classes grouped together. And if they are multiple classes do I look for the CSS designator for just that combination of classes or if I am trying to create a CSS rule that only affects that item do I write the designator for just that combination of classes and if that is the case how so I write that CSS rule? I need a lot of help here obviously. Anything anyone can suggest on finding out how to accomplish this I would appreciate a heads up.
Comment
There are no comments made yet.
Responses (3)
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hi,

To customize background color when hovering item, please add the following css rule to the templates/t3_bs3_blank/css/custom.css

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {

    background-color: #e7e7e7;

    color: #555555;

}


For active menu item, use the following css rule:


.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {

    background-color: #e7e7e7;

    color: #555555;

}


Regards.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Trent Perez
Trent Perez
Sherlock Holmes
Accepted Answer Pending Moderation
0
Votes
Undo
Those both work but I am still unclear on how you figure out what list of classes (I believe that is what they are called) you choose and how they are determined to be the correct set for the particular selections I am attempting to change. Because I have a large number of items to change the size, text, coloring, and other items like padding and so forth. I would like to be able to figure out what rules apply to what items or how to write a CSS rule for a particular item. As an example I have what I believe to be the part of the menu I want to make taller by increasing the line-height setting in CSS the div is as follows:
<div class="t3-navbar navbar-collapse collapse">

What I am unsure of is how do I designate this div in a css setting. How are the selectors arranged? Do I have to combine them as child designators, sibling designators, or what? I would appreciate a little help figuring this out.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
You should use Firebug, it is a good tool for web development, you can check the class of a element and add style for it.

Regards.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.