FA+ navigation icons

[Eric_ARM]

Hi there,

I have a problem with the navigation icons in FA+ 2.1. When choosing "Inline" they appear and work as expected, when choosing "Above" only a greater-than sign appears where the various icons are supposed to be and it looks like this:

To me it seems like the expected icons are in the source code but they are "overwritten" by the greater-than sign.

Any ideas?

 

[Russ]

This is a bug fixed in our next release. To fix this for now, go to the template: xb_header.less on your PARENT style, yes the one that says DO NOT EDIT , it's ok to edit it for this specific purpose.

Go down to around line: 385, find this entire section:

<xf:if is="property('xbNavigationIcons') == 'above' OR property('xbNavigationIcons') == 'inline'">
a[data-nav-id="home"]:before { .m-faContent("\f015"); }
a[data-nav-id="forums"]:before { .m-faContent("\f086"); }
a[data-nav-id="members"]:before { .m-faContent("\f0c0"); }
a[data-nav-id="xfrm"]:before { .m-faContent("\f013"); }
a[data-nav-id="whatsNew"]:before { .m-faContent("\f0e7"); }
a[data-nav-id="EWRrio"]:before { .m-faContent("\f1e8"); }
a[data-nav-id="xfmg"]:before { .m-faContent("\f03d"); }
a[data-nav-id="snog_raffles_navtab"]:before { .m-faContent("\f145"); }
a[data-nav-id="th_donate"]:before { .m-faContent("\f2b5"); }
a[data-nav-id="EWRatendo"]:before { .m-faContent(@fa-var-calendar-alt); }
a[data-nav-id="EWRcarta"]:before { .m-faContent(@fa-var-book); }
a[data-nav-id="EWRdiscord"]:before { .m-faContent(@fa-var-discord); .m-faBase('Brands'); }
a[data-nav-id="EWRmedio"]:before { .m-faContent(@fa-var-video-plus); }
a[data-nav-id="EWRporta"]:before { .m-faContent(@fa-var-home); }
a[data-nav-id="EWRrio"]:before { .m-faContent(@fa-var-play-circle); }
a[data-nav-id="EWRtorneo"]:before { .m-faContent(@fa-var-trophy); }
a[data-nav-id="xa_ams"]:before { .m-faContent("\f15c"); }
a[data-nav-id="xa_ubs"]:before { .m-faContent("\f303"); }
a[data-nav-id="xa_showcase"]:before { .m-faContent("\f00b"); }
a[data-nav-id="xa_sportsbook"]:before { .m-faContent("\f091"); }
a[data-nav-id="xa_pickem"]:before { .m-faContent("\f51e"); }
</xf:if>
<xf:if is="property('xbNavigationIcons') == 'above'">
.p-nav-list .p-navEl
{
    display: flex;
    align-items: center;
}

Replace with:

<xf:if is="property('xbNavigationIcons') == 'above' OR property('xbNavigationIcons') == 'inline'">
.XenBase .p-pageWrapper
{
    a[data-nav-id="home"]:before { .m-faContent("\f015"); }
    a[data-nav-id="forums"]:before { .m-faContent("\f086"); }
    a[data-nav-id="members"]:before { .m-faContent("\f0c0"); }
    a[data-nav-id="xfrm"]:before { .m-faContent("\f013"); }
    a[data-nav-id="whatsNew"]:before { .m-faContent("\f0e7"); }
    a[data-nav-id="EWRrio"]:before { .m-faContent("\f1e8"); }
    a[data-nav-id="xfmg"]:before { .m-faContent("\f03d"); }
    a[data-nav-id="snog_raffles_navtab"]:before { .m-faContent("\f145"); }
    a[data-nav-id="th_donate"]:before { .m-faContent("\f2b5"); }
    a[data-nav-id="EWRatendo"]:before { .m-faContent(@fa-var-calendar-alt); }
    a[data-nav-id="EWRcarta"]:before { .m-faContent(@fa-var-book); }
    a[data-nav-id="EWRdiscord"]:before { .m-faContent(@fa-var-discord); .m-faBase('Brands'); }
    a[data-nav-id="EWRmedio"]:before { .m-faContent(@fa-var-video-plus); }
    a[data-nav-id="EWRporta"]:before { .m-faContent(@fa-var-home); }
    a[data-nav-id="EWRrio"]:before { .m-faContent(@fa-var-play-circle); }
    a[data-nav-id="EWRtorneo"]:before { .m-faContent(@fa-var-trophy); }
    a[data-nav-id="xa_ams"]:before { .m-faContent("\f15c"); }
    a[data-nav-id="xa_ubs"]:before { .m-faContent("\f303"); }
    a[data-nav-id="xa_showcase"]:before { .m-faContent("\f00b"); }
    a[data-nav-id="xa_sportsbook"]:before { .m-faContent("\f091"); }
    a[data-nav-id="xa_pickem"]:before { .m-faContent("\f51e"); }
}
</xf:if>
<xf:if is="property('xbNavigationIcons') == 'above'">
.p-nav-list .p-navEl
{
    display: flex;
    align-items: center;
}

Should fix it for you. Apologies about that.

 

[Eric_ARM]

Hm, seems like the icons only display correctly with this line ~423 commented out:

    .m-faContent("\f105");

 

[Carlos]

I have 5 pages of similar issues on my custom skin. PC coming your way, @Russ.

 

[Russ]

I have 5 pages of similar issues on my custom skin. PC coming your way, @Russ.

Should make it a ticket

 

[Carlos]

Should make it a ticket

Ahh. too late. Oh well, next time.

EDIT: Moved to Ticket now. There, I solved it. BETTER!? (J/K)