Public Forums 71,145 posts

[aarona Friend aaronaJoin date: December 2016Posts: 3Downloads:10Uploads:2]

#993254

Hello,

I’ve added icons to the MegaMenu, however instead of the icons appearing alongside the menu text like it is shown in the MegaMenu Configuration menu, the icons are located above the menu text. I’ve attached screenshots of both.

I’d much prefer the icons to be to the left of the text to make the menu more compact, but I have been unable to find a way to change the way the icons are displayed. The issue does not appear to be related to the length of the menu item, as I have made them all short to test if that was the cause.

I’d appreciate any advice!

---

Attachments:

1. 
2. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#993334

Hi,

I could not duplicate this bug at my end on Purity III template. If possible, you can give me the URL of your site and admin login backend of your site as a private reply here. I will check further.

Regards

[aarona Friend aaronaJoin date: December 2016Posts: 3Downloads:10Uploads:2]

#993938

This reply has been marked as private.

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#994241

Hi,

The icons by default of JA Intranet template is using ionicons but I see you want to use font-awesome icon and you can apply this way

• Open templates/ja_intranet/local/css/template.css file

find and change

.navbar-default .navbar-nav > li > a > span,
.navbar-default .navbar-nav > li > a .fa {
  display: block;
  font-size: 27px;
  margin-bottom: 5px;
}

to

.navbar-default .navbar-nav > li > a > span,
.navbar-default .navbar-nav > li > a .fa {
  display: inline-block;
  font-size: 27px;
  margin-bottom: 5px;
}

Regards

[aarona Friend aaronaJoin date: December 2016Posts: 3Downloads:10Uploads:2]

#994410

Ninja Lead,

That was very helpful, and put me on the right track. I didn’t catch that font-awesome wasn’t supported. When I clicked on the search icon next to the icon box in MegaMenu, it took me to the font-awesome site. So I had used those.

I was able to successfully use the ionicons on my site, and will try your css adjustments later. Thank you.

Regards

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#994455

Hi,

font-awesome icon supports by default on T3 framework but the CSS style with dashboard vertical is not working as well and you have to make the custom work with the CSS style

I will close this thread now, if you have any further assistance please let me know

Regards

[Author]

Posts