mirror of
https://github.com/BookStackApp/BookStack.git
synced 2026-02-05 00:29:48 +03:00
Visually distinguish internal from external links (through little trailing icon) #1337
Reference in New Issue
Block a user
Delete Branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Originally created by @Wookbert on GitHub (Sep 2, 2019).
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 commented on GitHub (Sep 4, 2019):
would be a great idea to implement
@Wookbert commented on GitHub (Sep 4, 2019):
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 commented on GitHub (Sep 6, 2019):
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 commented on GitHub (Sep 6, 2019):
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 commented on GitHub (Sep 17, 2019):
@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.