tab icon

maszd

cXF Pack A
cXF Donor
Messages
112
Likes
43
#1
Hi @BassMan
i was configure my tab with an icon but i dont need some tab icon have an icon like forum and member tab, this is my config:
2017-08-18_190425.png

i see here at cXF 2 style can do this
Capture.PNG
can you share your config? or is need some extra addon?
thank you.
 

maszd

cXF Pack A
cXF Donor
Messages
112
Likes
43
#4
here is result from my config :
i need just activity, tags and upgrade have an icon, not forums and member tabs
ff.PNG
 

BassMan

Staff member
Administrator
Messages
775
Likes
404
Website
www.customizexf.com
#5
Oh, understand now. I have customized it for this site, yes.

Disable FA icons for NavTabs in style properties and add this to your EXTRA.css:

Code:
/* START - Font Awesome navTab1 (Activity) Icon */
.navTabs .navTab.navTab1 .navLink:before {
    display: block !important;
    font-family: FontAwesome;
    position: absolute;
    top: 0 px;
    left: 11px;
    border-left: none;
    content: "\f0e7";   
    font-size: 12px;
    font-weight: normal;
}
.navTabs .navTab.navTab1.selected .navLink:before {
    top: 1px;
}
.navTabs .navTab.navTab1:hover .navLink:before {
}
.navTabs .navTab.navTab1 .navLink {
    padding-left: 28px;
}
/* END - Font Awesome navTab1 (Activity) Icons */

/* START - Font Awesome navTab2 (Tags) Icon */
.navTabs .navTab.navTab2 .navLink:before {
    display: block !important;
    font-family: FontAwesome;
    position: absolute;
    top: 0 px;
    left: 11px;
    border-left: none;
    content: "\f02b";   
    font-size: 12px;
    font-weight: normal;
}
.navTabs .navTab.navTab2.selected .navLink:before {
    top: 1px;
}
.navTabs .navTab.navTab2:hover .navLink:before {
}
.navTabs .navTab.navTab2 .navLink {
    padding-left: 28px;
}
/* END - Font Awesome navTab2 (Tags) Icons */

/* START - Font Awesome navTab3 (Upgrades) Icon */
.navTabs .navTab.navTab3 .navLink:before {
    display: block !important;
    font-family: FontAwesome;
    position: absolute;
    top: 0 px;
    left: 11px;
    border-left: none;
    content: "\f135";   
    font-size: 12px;
    font-weight: normal;
}
.navTabs .navTab.navTab3.selected .navLink:before {
    top: 1px;
}
.navTabs .navTab.navTab3:hover .navLink:before {
}
.navTabs .navTab.navTab3 .navLink {
    padding-left: 28px;
}
/* END - Font Awesome navTab3 (Upgrades) Icons */
 

maszd

cXF Pack A
cXF Donor
Messages
112
Likes
43
#6
Thank you! working perfect! :)
cv.PNG

i hope you add more extra tab, default is only 3 custom tab, cause i have 6 custom tab :D
 

maszd

cXF Pack A
cXF Donor
Messages
112
Likes
43
#10
hmm...iam make a custom template addon like this:
View attachment 991

i dont know how to find ID for css for it.
this is the code :
Code:
<li class="navTab PopupClosed"><a href="https://forums.com/help/" class="navLink">Help</a></li>
$0
 
Last edited:

Create an account or login to comment

You must be a member in order to leave a comment

Create account

Create an account on our community. It's easy!

Log in

Already have an account? Log in here.

Top