This topic has 7 replies, 2 voices, and was last updated 6 years by 
-
-
We have been able to change the group icons, colours and text with your help. Thank you.
The last task on this list is to make them turn darker when selected. So I guess there must be 2 colours.
Thank you again.
Rob
Hi,
Just use this css
COPY CODE#buddypress div#item-nav li.current.selected { background: red; } #buddypress div#item-nav li.current.selected a,#buddypress div#item-nav li.current.selected a:before { color:#fff !important; }Cheers
RHi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThank you that Radu,
Most of our icons are different colours but you code gave me the clues I needed. All worked great. Thank you!
The one item that seems to be missing is the icons are not changing when they get the focus (tool tipped). The colour only changes when they are selected. You help on this would be appreciated.
Hi,
Great,
I think you are referring to the focus state.COPY CODE.bp-overlay-menu.is-user-profile #buddypress div#item-nav ul li a:focus {background:red;}Let me know
Cheers
RHi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionRadu,
No luck with the focus state for the tab’s icon but I was able to change the colour of the text via the hover state. See below. Any additional thoughts for the changing the colour of the icon itself?
#buddypress div#item-nav ul #nav-forum-groups-li a:before { color: #dcf8ff; }
#buddypress div#item-nav ul #nav-forum-groups-li a:hover { color: #30ebff; }
#buddypress div#item-nav #nav-forum-groups-li.selected a,#buddypress div#item-nav #nav-forum-groups-li.selected a:before { color: #30ebff; }Hi,
PLay with the next
COPY CODE#buddypress div#item-nav ul li a::before { color:red;} #buddypress div#item-nav ul li:hover a::before { color:green;} #buddypress div#item-nav li.current.selected a::before { color:yellow !important; }The first css rule changes the icon color.
Cheers
RHi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionRadu,
Thank you but we have different colours for each icon so the hover colour needs to be icon specific.
was able to change the colour of the text via the hover state with the following. Any additional thoughts for the changing the colour of the icon itself in the hover state?
#buddypress div#item-nav ul #nav-forum-groups-li a:hover { color: #30ebff; }
Thanks
Rob
This it’s the rule
#buddypress div#item-nav ul li:hover a::before { color:green;}
Or try with important
#buddypress div#item-nav ul li:hover a::before { color:green !important;}
For coloring the only hover icon use the above.
Cheers
RHi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution
The forum ‘General questions’ is closed to new topics and replies.
