olcf/olcf-user-docs

Manually add external link icon to menu items

tom-papatheodore opened this issue · 4 comments

On the main training landing page (https://docs.olcf.ornl.gov/training/index.html), the links properly show the "external link" icon. However, the corresponding links in the menu do not. This breaks our standard to always show when users are being directed away from the docs.

NOTE: If you embed e.g., a unicode arrow, the arrow does show up in the menu, however, the links on the landing page include both the correct icon and the arrow - so this is no good.

With _static/{css,js}/ we should be able to write some javascript that looks for the presence of http or https in the menu l2 hrefs and give them a custom CSS class include a FontAwesome external icon ::after

(link to icon)

It would be best to do this for all levels of the main nav, not just the training section.

This exact issue is why I avoided putting external links in the navigation for the training to begin with.

I think with a little bit of custom JS/CSS we can handle this one. I'm up to give it a try.