Font Awesome Nav Icons

[maldboy88]

Hey @Russ can this be used for fontawesome icons?
I have added fontawesome icon to my nav using

/*=Font Awesome Icon: Resources=*/
.navTabs .navTab.resources .navLink:before
{
display: block !important;
font-family: FontAwesome;
position: absolute;
top: 0 px;
left: 5px;
border-left: none;
/*--icon to display--*/
content: "\f01a";
/*--icon color--*/
color: #FFF;
/*--icon size--*/
font-size: 17px;
}
/*--icon color if tab is selected--*/
.navTabs .navTab.resources.selected .navLink:before {color: #ffeb3b;}
/*--icon color if mouse is hovered--*/
.navTabs .navTab.resources:hover .navLink:before {color: #ffeb3b;}
/*--adjust the px relative to the icon size--*/
.navTabs .navTab.resources .navLink  { padding-left: 25px; }

 

[Russ]

Sorry what exactly is the question? Is it referring to the like button here or font awesome nav icons?

 

[maldboy88]

Sorry what exactly is the question? Is it referring to the like button here or font awesome nav icons?

For font awesome nav icons @Russ

 

[Russ]

Started a new thread, ideally anytime a new issue/request/question comes up just start a new thread.

So does your code work?

I posted a very basic css version of icons in the nav here:

https://xenforo.com/community/threads/navbar-navtab-icons.78012/#post-791335

 

[maldboy88]

I have added the fonts (attachment)
What i want is the trick you have made for the Like on hover

 

[Russ]

Gotcha, so extra.css:

.navTabs .publicTabs .navTab .navLink:before
{
  transition: all 0.2s linear;
}
.navTabs .publicTabs .navTab:hover .navLink:before
{
   transform:rotate(360deg);
}

Should do the trick.

 

[maldboy88]

very funny haha

works,thank you very much @Russ