[cXF] Icons in Visitor menu

xFMafia

Administrator
Administrative
Messages
83
Reputation
104
Points
33
Would you like to have icons in Visitor menu like this?
255
Add this to your extra.less template:
CSS:
/* Icons in Visitor menu */
.menu-content.js-visitorMenuBody a.menu-linkRow {
    &:before {
        .m-faBase();
        padding-right: 5px;
    }
    &[href*="/whats-new/news-feed"]:before {
        .m-faContent(@fa-var-rss);
    }
    &[href*="/search/member"]:before {
        .m-faContent(@fa-var-comments);
    }
    &[href*="/account/reactions"]:before {
        .m-faContent(@fa-var-thumbs-up);
    }
    &[href*="/account/alerts"]:before {
        .m-faContent(@fa-var-bell);
    }
    &[href*="/account/account-details"]:before {
        .m-faContent(@fa-var-user-cog);
    }
    &[href*="/account/security"]:before {
        .m-faContent(@fa-var-shield-alt);
    }
    &[href*="/account/privacy"]:before {
        .m-faContent(@fa-var-lock);
    }
    &[href*="/account/preferences"]:before {
        .m-faContent(@fa-var-cogs);
    }
    &[href*="/account/signature"]:before {
        .m-faContent(@fa-var-signature);
    }
    &[href*="/account/upgrades"]:before {
        .m-faBase('Brands');
        .m-faContent(@fa-var-paypal);
    }
    &[href*="/account/connected-accounts"]:before {
        .m-faContent(@fa-var-users-class);
    }
    &[href*="/account/following"]:before {
        .m-faContent(@fa-var-user-plus);
    }
    &[href*="/account/ignored"]:before {
        .m-faContent(@fa-var-user-minus);
    }
    &[href*="/logout"]:before {
        .m-faContent(@fa-var-sign-out);
    }
}
/*****/
To change the icon edit value after @fa-var-.

To use the brand icon such as PayPal as you can see it in the above code add .m-faBase('Brands');.


If you are using route filters edit in the code what you've changed with filters (for example: if you're using route filter for account to something-else, then edit above code to suit.
 
Top