Bookstack: Visually distinguish internal from external links (through little trailing icon)

[Wookbert]

Describe the feature you'd like
I think it would be a good idea to trail external links with a related icon, so they can directly distinguished from internal links (without the need to specifically pay attention to the underlaying URL). The icon also comes in handy as separator when lining up multiple external links (no need for separation with comma).

Following is an example how external links currently look in BookStack...

... and how the same links look in Edgewall’s Trac Wiki

[timmkroe]

would be a great idea to implement

[Wookbert]

One could consider to trail internal links also with an icon, to distinguish it from coloured text without link. The icon could be as in the above example, but with the arrow pointing _into_ the rectangle (instead of out of it).

[nekromoff]

This is a trivial CSS change, e.g. see
https://jsfiddle.net/ZkbKp/

It could be changed to match domain etc., dynamically inserted via PHP.

[Wookbert]

Thanks for the hint, I don't wanna tweak my BookStack installation however, as any update would like break the tweak. So it should be a default implementation, though it needs a better designed item as in your example ;)

[james-geiger]

@Wookbert I just recently implemented exactly this using the "Custom HTML Head Content" in BookStack, which is stored to the database and wouldn't break if you were to update the application.

a[href*="//"]:not([href*="base-domain.com"])::after { content: "external link content"; }

If something like this were to be considered for inclusion in the default implementation, my thought would be that it would be the other way around: internal links to other parts of the book would be visually distinguished (and perhaps dynamically updated) instead of on the external link.